环境配置崩溃，一键脚手架救急！

作为开发者，你是否曾经遇到过这样的情况：周一早上，产品经理告诉你需要在本周五之前完成一个新项目。听到这个消息，你的第一反应可Neng是感到压力山大，但geng令人头疼的往往是项目的初始阶段——环境配置和脚手架搭建。

传统的开发流程中，环境配置和脚手架搭建是一项耗时且容易出错的工作。你需要手动安装各种依赖、配置工具、编写重复的代码，这些琐碎的任务不仅浪费时间，还可Neng因为版本不兼容或配置不当导致项目崩溃。

比如在使用create-react-app或Vite初始化项目时你需要手动添加TypeScript支持、路由管理、状态管理等功Neng。每个步骤dou需要查阅文档、安装依赖、编写配置代码。这种重复性的劳动不仅枯燥，还容易出错。

为了解决这些问题，TanVite应运而生。TanVite是一个React 19的生产级脚手架，它将繁琐的环境配置和脚手架搭建工作自动化，让你Ke以专注于业务逻辑的开发。

使用TanVite，你只需运行以下命令：

npm create tanvite@latest my-app
cd my-app
pnpm install
pnpm dev

短短四条命令，你就Neng得到一个完整、可运行的React应用，包含TypeScript支持、路由管理、状态管理等功Neng。

TanVite内置了现代化的开发工具链，包括TypeScript、ESLint、Prettier、Biome等。你无需手动配置这些工具，就Neng享受到它们带来的便利。

例如TanVite使用Biome替代了ESLint和Prettier，极大地提高了代码检查和格式化的速度。Biome是用Rust编写的，Neng够同时承担lint和format任务，让你的开发体验geng加流畅。

TanVite集成了TanStack Router，它从设计之初就考虑了TypeScript的支持。路由参数和搜索参数dou有完整的类型推断，让你在编写代码时geng加得心应手。

// 路由定义时就声明类型
const Route = createFileRoute({
  validateSearch:  => ({
    page: Number,
    sort: search.sort as 'asc' | 'desc' ?? 'asc',
  }),
})
// 组件里用的时候，类型是对的
const { page, sort } = Route.useSearch
// page: number, sort: 'asc' | 'desc'
// 不是 string，不需要手动转换

TanVite提供了两种Mock方式：基于MSW的浏览器级别拦截和基于Prism的独立服务器。你Ke以根据需求选择合适的Mock方案，加速前端开发。

pnpm dev:mock     # Vite + MSW，浏览器级别拦截接口
pnpm openapi:mock # 启动独立的 Prism Server

TanVite内置了OpenSpec，一套轻量的规格管理工作流。它将功Neng规格和变geng提案与代码一起进行版本控制，确保文档与代码的一致性。同时TanVite还为AI工具提供了技Neng包，让AI生成的代码geng加符合项目规范。

openspec/
├── changes/    # 进行中的需求变geng提案
├── specs/      # 基准功Neng规格
└── config.yaml

TanVite不仅仅是一个脚手架工具，它代表了一种geng高效、geng现代化的前端开发方式。通过自动化环境配置、提供类型安全的路由管理、高效的Mock解决方案以及与AI工具的无缝集成，TanVite让开发者Neng够专注于业务逻辑的实现，从而提高开发效率，减少不必要的麻烦。

Ru果觉得TanVite有用，欢迎给项目点个Star ⭐。也欢迎在评论区分享你们团队是怎么解决工程化问题的。

项目地址：

在线Demo：