Vue3 简介

1. Vue3简介

• 2020年9月18日，Vue.js发布版3.0版本，代号：One Piece（n
• 经历了：4800+次提交、40+个RFC、600+次PR、300+贡献者
• 官方发版地址：Release v3.0.0 One Piece · vuejs/core
• 截止2023年10月，最新的公开版本为：3.3.4

1.1【性能的提升】

● 打包大小减少41%。
● 初次渲染快55%, 更新渲染快133%。
● 内存减少54%。

1.2【 源码的升级】

● 使用Proxy代替defineProperty实现响应式。
● 重写虚拟DOM的实现和Tree-Shaking。

1.3【拥抱TypeScript】

● Vue3可以更好的支持TypeScript。

1.4【新的特性】

1. Composition API（组合API）：
   • setup
   • ref与reactive
   • computed与watch…
2. 新的内置组件：
   • Fragment
   • Teleport
   • Suspense…
3. 其他改变：
   • 新的生命周期钩子
   • data 选项应始终被声明为一个函数
   • 移除keyCode支持作为 v-on 的修饰符…

2. 创建Vue3工程

2.1. 【基于 vue-cli 创建】

点击查看 Vue CLI 官方文档
备注：目前vue-cli已处于维护模式，官方推荐基于 Vite 创建项目

## 查看@vue/cli版本，确保@vue/cli版本在4.5.0以上
  vue --version

  ## 安装或者升级你的@vue/cli 
  npm install -g @vue/cli

  ## 执行创建命令
  vue create vue_test

  ##  随后选择3.x
  ##  Choose a version of Vue.js that you want to start the project with (Use arrow keys)
  ##  > 3.x
  ##    2.x

  ## 启动
  cd vue_test
  npm run serve

2.2. 【基于 vite 创建】(推荐)

vite 是新一代前端构建工具，官网地址：