分享每一天-Vue 3.0 正式发布：代号“One Piece”

Vue 3.0 正式发布：代号“One Piece”

前端技术 2719 0 创建时间：2020-10-06 17:26:59

vuejs3.0

##### Vue 3.0 正式发布：代号“One Piece”
2020 年 9 月 18 日晚，Vue 团队发布了 Vue 3.0 正式版本，代号为 One Piece(海贼王)。本次主版本更新包含性能的改进，更小的 bundle 体积，对 TypeScript 更好的支持，用于处理大规模用例的全新 API，以及为框架未来的长期迭代奠定了夯实的基础。
![](http://www.seedblog.cn/uploads/article/2020-10-06/n0mclk5lLfL5ZnmPZbO8yB3CDc0c34vh4xO69oNE.png)
官方 Release Doc 地址：
https://github.com/vuejs/vue-next/releases/tag/v3.0.0

#### 分层内部模块

Vue 3.0 核心仍然可以通过一个简单的标签来使用，但它的内部结构已经被重新编写成一个解耦模块的集合。新的架构提供了更好的可维护性，并允许终端用户通过 tree-shaking 减少多达一半的运行时大小。

这些模块还暴露了底层的 API，解锁了许多高级用例。

编译器支持自定义 AST 转换，用于构建时的自定义 (例如构建时的 i18n)。

核心运行时提供了一级的 API，用于创建针对不同渲染目标 (如原生移动端、WebGL 或终端) 的自定义渲染器。默认的 DOM 渲染器也是使用相同的 API 构建的。

@vue/reactivity 模块导出的函数可以直接访问 Vue 的反应性系统，并且可以作为一个独立的包使用。它可以与其他模板解决方案 (如 lit-html) 配对使用，甚至在非 UI 场景中使用。

#### 解决规模问题的新 API

在 Vue 3 中，基于对象的 2.x API 基本没有变化。不过，3.0 还引入了 Composition API——一套新的 API，旨在解决 Vue 在大规模应用中的使用痛点。组成 API 建立在反应性 API 之上，实现了类似于 React 钩子的逻辑组成和重用，比 2.x 基于对象的 API 更灵活的代码组织模式和更可靠的类型推理。

Composition API 也可以通过 @vue/composition-api 插件与 Vue 2.x 一起使用，目前已经有适用于 Vue 2 和 3 的组成 API 实用库 (如 vueuse、vue-composable)。

#### 性能改进

Vue 3 与 Vue 2 相比，在捆绑大小 (tree-shaking 时减少了 41%)、初始渲染 (快了 55%)、更新 (快了 133%) 和内存使用 (少了 54%) 方面都有显著的性能提升。

在 Vue 3 中，我们采取了“compiler-informed 虚拟 DOM”的方法：模板编译器执行积极的优化，并生成渲染函数代码，以提升静态内容，为绑定类型留下运行时提示，最重要的是，扁平化模板内的动态节点，以减少运行时遍历的成本。因此，用户可以获得两全其美的效果：从模板中获得编译器优化的性能，或者在用例需要时通过手动渲染函数直接控制。

#### 改进的 TypeScript 集成

Vue 3 的代码库是用 TypeScript 编写的，具有自动生成，测试和捆绑的类型定义，因此它们始终是最新的。Composition API 可以很好地处理类型推断。Vetur 是我们的官方 VSCode 扩展，现在利用 Vue 3 改进的内部键入功能支持模板表达式和 props 类型检查。哦，如果您愿意，Vue 3 的打字完全支持 TSX。

#### 实验特性

```javascript
我们为单文件组件 (SFC，即 .vue 文件) 提出了两个新特性：

这些功能已在 Vue 3.0 中实现并可用，但仅出于收集反馈的目的而提供。在 RFC 合并之前，它们将保持试验状态。

我们还实现了一个当前未公开的 <Suspense> 组件，该组件允许在初始渲染或分支开关上等待嵌套的异步依赖项 (异步组件或具有 setup() 的组件)。我们正在与 Nuxt.js 团队一起测试和迭代此功能 (Nuxt 3 即将发布)，并且很可能会在 3.1 版中将其固化。

#### 分阶段发布流程

Vue 3.0 的发布标志着该框架的全面就绪。尽管某些框架子项目可能仍需要进一步的工作才能达到稳定状态 (特别是 devtools 中的路由器和 Vuex 集成)，但我们认为今天使用 Vue 3 启动新的绿色项目是合适的。我们还鼓励图书馆作者开始升级您的项目以支持 Vue 3。

请查阅 Vue 3 工具库指南以获取有关所有框架子项目的详细信息。

#### 迁移和 IE11 支持

由于时间限制，我们已推迟了迁移版本 (具有 v2 兼容行为的 v3 版本 + 迁移警告) 和 IE11 版本，并计划在 2020 年第四季度重点关注它们。因此，计划迁移现有 v2 应用程序的用户或要求 IE11 支持人员此时应意识到这些限制。

Vue 3.0 正式发布：代号“One Piece”

商品推荐

广告推荐

推荐文章