新的框架级别推荐
Vue 3 的支持库进行了重大更新。以下是新的默认建议的摘要:
- 新版本的 Router, Devtools & test utils 来支持 Vue 3
- 构建工具链: Vue CLI -> Vite
- 状态管理: Vuex -> Pinia
- IDE 支持: Vetur -> Volar
- 新的 TypeScript 命令行工具: vue-tsc
- 静态网站生成: VuePress -> VitePress
- JSX:
@vue/babel-preset-jsx
->@vue/babel-plugin-jsx
详情说明
构建工具链
我们现在推荐 Vite 作为 Vue 3 项目的新的构建工具链。 Vite 是一个新的构建工具,提供极快的服务器启动和热更新性能。它最初由 Vue 团队创建,但现在是一个跨框架工具。详细了解我们为何推荐 Vite。
您可以通过我们新的脚手架工具 create-vue
创建一个由 vite 驱动的 Vue 3 项目:
npm init vue@3
虽然 Vue CLI 也已升级以支持 Vue 3,但它现在处于维护状态,不再推荐用于新项目。有关从 Vue CLI 迁移到 Vite 的信息:
或者您也可以参阅 Vue 新文档中工具章节。
Vue Router
Vue Router 4.0 提供了对 Vue 3 的支持,并且自身也有许多重大的变化。查看其迁移指南以获取完整的详细信息。
状态管理
Pinia 是我们新推荐的大规模状态管理的解决方案。 Pinia 是作为 Vuex 5 的雏形而创建的,现已实现了 Vuex 5 中计划实际实现的大部分功能。考虑到核心团队成员 Eduardo 的倾情投入,我们决定保留其原始名称。
Vuex 4.0 还提供对于 Vue 3 的支持,其 API 与 3.x 大致相同,如果您有需要迁移到 Vue 3 的应用了 Vuex store 的项目,仍然可以使用 Vuex 4.0。唯一的重大变化是插件的安装方式。
IDE 支持
Volar 现在是新的官方 VSCode 扩展,大大改进了对 Vue SFC 的 TypeScript 支持,包括在模板表达式中提供完整的类型推断。
如果您以前安装过 Vetur,请确保将其禁用以避免与 Volar 冲突。
Devtools Extension
Devtools 扩展已得到了重大更新(作为 v6 发布)以同时支持 Vue 2 和 Vue 3。如果您之前安装过 beta 版本的 v6,您现在可以将其删除并安装稳定版本的扩展。
TypeScript 支持
您现在可以使用 vue-tsc 从命令行对 Vue SFC 进行类型检查和生成定义文件。
或者您也可以参阅 新文档中的 TypeScript 指南。
静态站点生成器
VitePress 是 VuePress 的精神继承者,建立在 Vue 3 + Vite 的基础之上。它提供了卓越的开发体验,还可以生成更快的站点。
JSX
现在通过 @vue/babel-plugin-jsx
提供对于 Vue3 中 JSX 的支持。