vue-cli
代码块
npm install -g @vue/cli
vue create 01-vue3-cli
cd 01-vue3-cli
vue add vue-next
npm run serve
webpack
代码块
git clone https://github.com/vuejs/vue-next-webpack-preview.git 01-vue3-webpack
cd 01-vue3-webpack
npm install
npm run dev
vite
这是尤大开发的新工具,目的是以后取代webpack,原理就是利用浏览器现在已经支持es6的import了,碰见import会发送一个http请求去加载文件,vite拦截这些请求,做一些预编译,就省去了webpack冗长的打包时间,提升开发体验
代码块
npm install -g create-vite-app
create-vite-app 01-vue3-vite
cd 01-vue3-vite
npm install
npm run dev
我们打开localhost:3000
看下network,大概就知道vite的工作原理,这也是为什么它能做到复杂项目的秒开,天生的按需加载,以后我们会手写一个vite,还会去阅读vite的源码