Loading [MathJax]/jax/output/CommonHTML/config.js
前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >Vue 3 将成为新的默认版本

Vue 3 将成为新的默认版本

作者头像
用户10106350
发布于 2022-10-28 09:57:05
发布于 2022-10-28 09:57:05
74100
代码可运行
举报
文章被收录于专栏:WflynnWebWflynnWeb
运行总次数:0
代码可运行

从库到框架

在最开始的时候,Vue 仅仅是一个运行时库。但这些年来,它已经逐步发展成了一个包含许多子项目的框架:

  • 核心库,即 vue npm 包
  • 内容足够当作一本书的文档
  • 构建工具链(Vue CLI、Vue Loader 和其他支持包)
  • 用于构建单页应用的路由 Vue Router
  • 用于状态管理的 Vuex
  • 用于调试和分析的浏览器开发者工具扩展
  • 用于支持开发单文件组件的 VSCode 扩展 Vetur
  • 用于进行静态风格/错误检查的 ESLint 插件
  • 用于组件测试的 Vue Test Utils
  • 利用 Vue 运行时功能的定制 JSX Babel 插件
  • 用于静态网站生成的 VuePress

正因为 Vue 是一个社区驱动的项目,才让这一切成为可能。这些项目中的许多都是由社区成员发起,他们后来成为了 Vue 团队的成员。其余的项目最初由我发起,但现在除了核心库之外,几乎都完全由团队维护。

Vue 3 的 “软发布”

随着核心库发布新的大版本,框架的所有其他部分也需要一起同步更新。我们还需要为 Vue 2 用户提供一个升级方案。对于 Vue 这样一个社区驱动的团队来说,这是一个巨大的工程。在 Vue 3 的核心库完成的时候,框架的其他部分要么还在 beta 状态,要么还没有开始适配 Vue 3。当时我们的决定是先发布核心库,这样早期用户可以先用起来,库和上层框架的开发者也可以先适配起来,而我们则继续更新框架的其余部分。

在这个过程中,我们依然将 Vue 2 保留为文档和 npm 安装时的默认版本。这是因为我们知道对于大部分用户来说,在 Vue 3 的其余部分完善以前,Vue 2 仍然提供了更一致且完整的体验。

崭新的 Vue

“软发布” 的过程比预期要长,但这个时刻终于到了:我们很高兴地宣布,Vue 3 将在 2022 年 2 月 7 日 成为新的默认版本。 除了 Vue 核心库以外,我们还几乎改进了框架的每个方面。

  • 基于 Vite 的极速构建工具链
  • <script setup> 带来的开发体验更丝滑的组合式 API 语法
  • Volar 提供的单文件组件 TypeScript IDE 支持
  • vue-tsc 提供的针对单文件组件的命令行类型检查和生成
  • Pinia 提供的更简洁的状态管理
  • 新的开发者工具扩展,同时支持 Vue 2/Vue 3,并且提供一个插件系统来允许社区库自行扩展开发者工具面板。 我们还彻底重写了主文档。全新的 vuejs.org (目前处于待发布状态,中文版的翻译还在进行中) 将提供最新的框架概述与开发建议、针对不同背景的用户的灵活的学习路径,在整个指南与示例中都能够在选项式 API 和组合式 API 之间进行切换,以及许多新的深入章节。新文档本身的网站性能也非常优秀——我们将在不久后的另一篇博文中详细探讨一下。

版本切换细节

下面是我们所说的“新的默认版本”的具体细节。此外,请务必阅读文末的 可能需要采取的措施 部分,来确认你是否需要在默认版本切换之前做相应改动以避免发生异常。

npm 发布标签

  • npm install vue 将默认安装 Vue 3。
  • 所有其他官方 npm 包的 latest 发布标签将指向其 Vue 3 的兼容版本,包括 vue-routervuexvue-loader@vue/test-utils

官方文档与站点

所有的文档和官方站点将默认切换到 Vue 3 版本。包括: - vuejs.org - router.vuejs.org - vuex.vuejs.org - vue-test-utils.vuejs.org (将迁移到 test-utils.vuejs.org) - template-explorer.vuejs.org 请注意,新的 vuejs.org 将是完全重写的版本,而不是目前部署在 v3.vuejs.org 的版本。 这些站点当前的 Vue 2 版本将被迁移到新地址 (版本前缀表示库的各自版本,而非 Vue 核心库的版本): - vuejs.org -> v2.vuejs.org (旧的 v2 网址将自动重定向到新地址上) - router.vuejs.org -> v3.router.vuejs.org - vuex.vuejs.org -> v3.vuex.vuejs.org - vue-test-utils.vuejs.org -> v1.test-utils.vuejs.org - template-explorer.vuejs.org -> v2.template-explorer.vuejs.org

GitHub 仓库

在写这篇文章时,仓库相关的变化已经生效了。 vuejs 组织下的所有 GitHub 仓库将把默认分支切换到 Vue 3 对应的版本。此外,以下仓库将被重命名,以删除其名称中的 next: - vuejs/vue-next -> vuejs/core - vuejs/vue-router-next -> vuejs/router - vuejs/docs-next -> vuejs/docs - vuejs/vue-test-utils-next -> vuejs/test-utils - vuejs/jsx-next -> vuejs/babel-plugin-jsx 此外,主文档的翻译仓库将被移至 vuejs-translations 组织下。 GitHub 会自动处理仓库的重定向,所以之前的源码与 issue 问题的链接应该仍然有效。

开发者工具扩展

开发者工具 v6 目前是发布到 Chrome Web Store 的 beta 频道下的,在版本切换后,将移至稳定频道。 目前的稳定频道仍然可用。它将被迁移到遗留频道。

可能需要采取的措施

未指定版本的 CDN 链接

如果你通过 CDN 链接使用 Vue 2 而没有指定版本,请确保通过 @2 来指定一个版本范围:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
- <script src="https://unpkg.com/vue"></script>
+ <script src="https://unpkg.com/vue@2"></script>

- <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
+ <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.min.js"></script>

注意:即使使用 Vue 3,你也应该始终在生产环境指定一个版本范围,以避免意外地加载到未来的大版本。

npm latest 标签

如果你使用 `latest` 标签或 `*` 来从 npm 安装 Vue 或其他官方库,请更新为明确使用兼容 Vue 2 的版本:

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
{
  "dependencies": {
-   "vue": "latest",
+   "vue": "^2.6.14",
-   "vue-router": "latest",
+   "vue-router": "^3.5.3",
-   "vuex": "latest"
+   "vuex": "^3.6.2"
  },
  "devDependencies": {
-   "vue-loader": "latest",
+   "vue-loader": "^15.9.8",
-   "@vue/test-utils": "latest"
+   "@vue/test-utils": "^1.3.0"
  }
}
本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2022-01-21,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 WflynnWeb 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
Vue 3 将成为新的默认版本
请务必阅读文末的 可能需要采取的措施 部分,来确认你是否需要在默认版本切换之前做相应改动以避免发生异常。
程序员海军
2022/01/26
7070
Vue 3 将成为新的默认版本
什么~?Vue3马上就成为了Vue的新的默认版本,扶我起来,还能学…^-^
"好坏交替才是完整的人生轨迹。人生的道路布满了荆棘,同时有快乐的时光,有让我们感到幸福与成功的时刻,关键是保持正面的看法,用毫不动摇的决定、努力去面对人生中的失败与成功。"
用户9078190
2022/10/28
4410
什么~?Vue3马上就成为了Vue的新的默认版本,扶我起来,还能学…^-^
最全的 Vue 官方生态整理,看看你是不是都知道?
按照尤雨溪之前的官宣,Vue 3 已经在 「2022 年 2 月 7 日」成为新的默认版本
Leecason
2022/07/13
9780
Vue简介
这些特点,你不需要一个个去记住,我们在后面的学习和开发中都会慢慢体会到的,一些技术点我也会在后面进行讲解。
Qwe7
2022/05/25
2500
Vue 2.0 正式发布了!
今天我非常兴奋的宣布正式发布 Vue.js 2.0:Ghost in the Shell。历经 8 个 alpha 版本、8 个 beta 版本和 8 个 rc 版本 (矮油好巧!),Vue.js 2.0 已经为生产环境准备好了!我们的官方教程 vuejs.org/guide 也已经全面更新。 2.0 的工作自今年 4 月启动以来,核心团队为 API 设计、bugfix、文档、类型声明做出了很重要的贡献,社区中的同学们也反馈了很多有价值的 API 建议——在此为每一位参与者致以大大的感谢! 2.0 有哪些
时见疏星
2018/06/01
1.1K0
Vue-cli教程
一、安装vue-cli 安装vue-cli的前提是你已经安装了npm,安装npm你可以直接下载node的安装包进行安装。你可以在命令行工具里输入npm -v  检测你是否安装了npm和版本情况。出现版
用户1212940
2018/01/23
2K0
Vue-cli教程
vue深度作用选择器
我们知道vue中的style标签带scoped属性时,它的CSS只作用于当前组件中的元素
阿超
2022/08/17
8560
vue深度作用选择器
vue引入bootstrap——webpack
阅读本文前,应该能够搭建环境,使用vue-cli进行项目的创建,可以参考文章:
Java架构师必看
2021/05/14
8200
vue引入bootstrap——webpack
2018 我所了解的 Vue 知识大全 (二)
去年 12 月份开始接触 vue ,到现在我发现真的要多练习,对于语法和 API 的了解才更加深刻,结合小 demo 看,所有的东西都变得通俗易懂啦。请相信,语言只是一种工具,核心依旧是编程思想,所以学习并不难
sunseekers
2023/06/10
1770
2018 我所了解的 Vue 知识大全 (二)
三年项目升级Vue3的踩坑经历
我们组三年前开发了一套NoCode平台命名为米鹿平台,旨在提升运营生产力,目前这个系统的用户数一直维持在一个相对较高的水准,并且有越来越多的新用户加入,所以对该平台开放的能力要求就变高了许多。经过多次会议后,我们要将这个平台改造一下,可以接受外部组件,任何业务方的开发人员都可以给我们平台提供自定义组件,这样可以进一步提升开发和运营效率,充分发挥这个平台的作用。由于即将接入我们平台的多个业务方已经拥抱Vue3,所以我们决定将米鹿平台升级到Vue3。
乐圣
2022/11/19
2.8K0
Vue 2.7 “Naruto”发布,新特性介绍
2.7 是 Vue 2.x 的最终版本。在这个版本之后,Vue 2 进入了 LTS(长期支持),从现在开始持续 18 个月,并且将不再接收新功能。这意味着Vue 2 将在 2023 年底结束生命周期。
房东的狗丶
2023/02/17
1.4K0
Vue3学习笔记-从HelloWord到动态菜单的实现
重新拾起我两年期的笔记,以面向运维开发的角度,在裸辞期间,继续学习前端开发,目标能把LLM的机器人和前端互动结合起来
行者深蓝
2023/12/08
6270
Vue.js入门手册整理
webpack简介,webpack是一个前端资源加载/打包工具,将各种js/css/html代码最后打包编译到一起。vuejs已经集成
SmileNicky
2019/03/20
2.3K0
Vue.js入门手册整理
Vue 测试速成班
在你快要完成一个项目时,突然工程里的很多地方都出现了 bug,你修完一个又冒出新的一个,就像在玩打地鼠游戏一样……几轮下来,你会感到一团糟。
WecTeam
2020/02/11
2.8K0
Vue 测试速成班
vue,vue-router,vuex,axios整合
*vue官网:https://cn.vuejs.org/ vue-router官网:https://router.vuejs.org/zh-cn/ vuex官网:https://vuex.vuejs.org/zh-cn/ axios中文说明:https://www.kancloud.cn/yunye/axios/234845 vue-cli建立项目 npm install -g vue-cli 全局安装vue脚手架 vue init webpack-simple project-name 使用w
conanma
2021/11/03
1.2K0
进阶|基于webpack的架构与构建优化——YY-DSA搭建心得
今天的投稿人是鹅厂的Casta Mo 这里附上他的github链接... https://github.com/CastaMo 欢迎留言、转发! 1. 项目背景   我们前端团队近期在为腾讯云DSA业务搭建内部运营运维系统【简称YY-DSA】,既然是内部系统,我们就可以“为所欲为”地选技术栈,搭框架,但要遵循以下约定:   - 项目架构清晰,各个模块各司其职、互不耦合或者尽可能降低耦合度。 - 在确保架构稳定的前提下,尽可能提升整体的效率,包括应用程序的效率以及研发流程的效率,而牺牲流程效率来换取程序效率
用户1097444
2022/06/29
8180
进阶|基于webpack的架构与构建优化——YY-DSA搭建心得
vue脚手架
学习vue之初就接触到了脚手架,去年的时候还是使用vue cli进行构建,今年基本都用vite了,官方也都推荐这种方式,那就赶快用起来,快速开发属于自己的vue应用。
希里安
2023/10/30
3070
vue脚手架
从0开始Vue.js 和 Webpack 4 [1]
核心目标 使用webpack-dev-server热加载模块 使用eslint文件瘦身 使用stylus进行CSS预处理 使用@ vue / test-utils和Jest进行测试 环境需求 npm init -y npm install --save vue vue-router npm install --save-dev webpack webpack-cli 文件结构 [文件结构] app.js : 应用程序入口 App.vue: 根组件 pages: 包含所有顶级组件的文件夹,每个组件都有一个
bit20041436
2018/09/05
1.3K0
从0开始Vue.js 和 Webpack 4 [1]
Vue 全家桶、原理及优化简议
使用过vue的程序员一般这样评价它,“vue.js兼具angular.js和react.js的优点”。Vue.js 是一个JavaScript MVVM(Model-View-ViewModel)库,用于渐近式构建用户界面。它以数据驱动和组件化思想构建,采用自底向上增量开发的设计思想。相比Angular.js,Vue.js API更加简洁;相比 React + Redux 复杂的架构,Vue.js 上手更加容易。
LIYI
2019/09/02
2.1K0
Vue 全家桶、原理及优化简议
VUE2全家桶精讲
概念:Vue (读音 /vjuː/,类似于 view) 是一套构建用户界面的渐进式框架。
HelloWorldZ
2024/03/20
5040
VUE2全家桶精讲
相关推荐
Vue 3 将成为新的默认版本
更多 >
领券
💥开发者 MCP广场重磅上线!
精选全网热门MCP server,让你的AI更好用 🚀
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验