Vue3.0 曾经公布一段时间了,特地是还公布了一个打包构建工具 Vite,据说是能够干掉 webpack 的,趁这段时间有空,自己也体验了一下。
想应用 Vue3.0 不肯定要用 Vite,vue-cli 也能够构建。
$ npm install -g @vue/cli
确保曾经降级到最新的版本:
$ npm update -g @vue/cli
$ vue --version
而后创立我的项目:
$ vue create vue3-demo
抉择第二个 Vue 3 Preview,或者自定义装置
应用 CLI 构建的我的项目还是应用 webpack 进行打包的。这里介绍下用 vite 构建。首先装置 vite 构建工具:
$ npm install -g create-vite-app
创立我的项目:
# 上面两个命令都能够
$ create-vite-app vue3-demo
$ cva vue3-demo
跟 CLI 不一样,vite 目前没有提供命令行交互的选项,就是依照默认的模板进行创立的。CLI 创立我的项目会主动从 npm 拉取依赖,而 vite 创立我的项目没有拉取依赖,因而执行命令之后很快就创立实现了。
创立实现的我的项目构造是这样的:
package.json
中能够看到依赖非常少,只有 vite
和 @vue/compiler-sfc
,没有 babel,因为 vite 是通过浏览器去解析模块。
接下来手动拉一下依赖:
$ npm install
而后启动我的项目:
$ npm run dev