Vue3简介

一、对比于Vue2，所带来的优势

1、性能得到了显著的提升；（打包大小减少了41%、初次渲染提速55%、更新渲染提速133%、内存减少54%）

2、源码的升级：

        ①、使用Proxy代替defineProperty实现响应式；

        ②、重写虚拟DOM的实现和Tree-Shaking；

3、Vue3能够更好的支持typeScript；

4、新的特性：

        ①、Composition API（组合API）

                setup配置、ref和reactive、watch和watchEffect、provide和inject等；

        ②、新的内置组件：

                Fragment、Teleport、Suspense等；

        ③、其他改变：

                新的生命周期钩子、data选项应始终被声明为一个函数、移除keyCode支持作为v-on的修饰符；

二、创建vue3.0工程

1、使用vue-cli（脚手架）创建

①、首先查看vue/cli的版本号是否在4.5.0以上

vue -V

vue --version

 

②、低于4.5.0更新vue/cli，高于则开始创建项目，在所需要创建的目录下，执行：

vue create 项目名

 

③、选择vue3项目，等待安装完毕即可；

2、使用vite创建

vite是新一代前端构建工具，由vue团队打造的；

优势：

1、开发环境中，无需打包操作，可快速冷启动；

2、轻量快速的热重载（HMR）；

3、真正的按需编译，不再需要等待整个应用编译完成；        

步骤：

①、创建工程：

npm init vite-app 项目名

②、进入工程目录：

cd 项目目录

 

③、安装依赖

npm install

④、运行

npm run dev