关于前端框架vue2升级为vue3的相关说明

一些框架需要升级

当前(202306) Vue 的最新稳定版本是 v3.3.4。Vue 框架升级为最新的3.0版本,涉及的相关依赖变更有:

  • 前提条件:已安装 16.0 或更高版本的Node.js(摘)

  • 必须的变更:核心库vue@2>3、路由vue-router@3>4、状态管理vuex@3>4

  • 构建工具链: Vue CLI > Vite(摘)

  • 状态管理: Vuex > Pinia, Pinia 是作为 Vuex 5 的雏形而创建的(摘)

  • IDE 支持: Vetur > Volar(摘)

  • Vue CLI是官方提供的基于 Webpack 的 Vue 工具链,它现在处于维护模式。我们建议使用 Vite 开始新的项目,除非你依赖特定的 Webpack 的特性;(摘)

  • 更详细框架变更与推荐,可访问 vue3 离线文档;

创建 vue3 项目

虽然 Vue CLI 也已升级以支持 Vue 3,但它现在处于维护状态,不再推荐用于新项目。有关从 Vue CLI 迁移到 Vite 的信息;(摘)

  • 通过vue/cli@5 创建:Vue Router+Vuex+Sass+Jest+ESLint+Prettier
bash 复制代码
vue create vue3-demo
cd vue3-demo
yarn serve
  • 使用 vite 创建:Vue Router+Pinia+Vitest+ESLint+Prettier
bash 复制代码
# 这一指令将会安装并执行 create-vue,它是 Vue 官方的项目脚手架工具
# 生成的项目中的示例组件使用的是组合式 API 和 <script setup>,而非选项式 API
npm init vue@latest
cd vue3_vite
npm install
npm run format
npm run dev

vue-router迁移说明

在 Vue Router API 从 v3(Vue2)到 v4(Vue3)的重写过程中,大部分的 Vue Router API 都没有变化,但是在迁移你的程序时,你可能会遇到一些破坏性的变化(摘)

vuex迁移说明

几乎所有的 Vuex 4 API 都与 Vuex 3 保持不变。但是,仍有一些非兼容性变更需要注意。(摘)

相关推荐
贵沫末9 小时前
React——基础
前端·react.js·前端框架
摸鱼仙人~15 小时前
深入理解 classnames:React 动态类名管理的最佳实践
前端·react.js·前端框架
三水气象台1 天前
用户中心Vue3网页开发(1.0版)
javascript·css·vue.js·typescript·前端框架·html·anti-design-vue
杨进军1 天前
React 协调器 render 阶段
前端·react.js·前端框架
Codebee1 天前
50行代码搞定OneCode摄像头插件:快速定制实战指南
前端框架·开源·ecmascript 6
杨进军1 天前
React 中 root.render 与 unmount 函数的流程
前端·react.js·前端框架
上单带刀不带妹1 天前
手写 Vue 中虚拟 DOM 到真实 DOM 的完整过程
开发语言·前端·javascript·vue.js·前端框架
杨进军1 天前
React 创建根节点 createRoot
前端·react.js·前端框架
vim怎么退出1 天前
万字长文带你了解微前端架构
前端·微服务·前端框架
Codebee2 天前
OneCode自主UI设计体系:架构解析与核心实现
前端·javascript·前端框架