vite 是什么
vite —— 一個(gè)由 vue 作者尤雨溪開發(fā)的 web 開發(fā)工具，它具有以下特點(diǎn)：
1.快速的冷啟動(dòng)
2.即時(shí)的模塊熱更新
3.真正的按需編譯
Vite介紹
Vite嘉栓，一個(gè)基于瀏覽器原生 ES imports 的開發(fā)服務(wù)器甲脏。利用瀏覽器去解析 imports，在服務(wù)器端按需編譯返回蒙秒，完全跳過了打包這個(gè)概念勃黍，服務(wù)器隨起隨用。同時(shí)不僅有 Vue 文件支持晕讲，還搞定了熱更新覆获，而且熱更新的速度不會(huì)隨著模塊增多而變慢。針對(duì)生產(chǎn)環(huán)境則可以把同一份代碼用 rollup 打包瓢省。
搭建第一個(gè) Vite 項(xiàng)目
兼容性注意
Vite 需要Node.js版本 >= 12.0.0弄息。
使用 NPM:
npm init @vitejs/app
使用 Yarn:
yarn create @vitejs/app
通過如下命令搭建
npm init vite-app
cd
npm install
npm run dev
搭建后的項(xiàng)目目錄結(jié)構(gòu)如下：
因?yàn)?Vite 是一個(gè)基于原生 ESM 的開發(fā)服務(wù)器，所以可以看出是秒啟動(dòng)的勤婚。
初始化搭建的demo也比較簡單
看下package.json里的代碼：
{
"name": "vite-app",
"version": "0.0.0",
"scripts": {
"dev": "vite",
"build": "vite build"
},
"dependencies": {
"vue": "^3.0.4"
},
"devDependencies": {
"vite": "^1.0.0-rc.13",
"@vue/compiler-sfc": "^3.0.4"
}
}
可以看出vite 是和 vue 3 搭配使用的摹量。
vue 3 無論性能、包大小還有 ts 加持方面馒胆，vue 3 都遠(yuǎn)優(yōu)于 vue 2的缨称。?
而build的過程，是利用 Rollup 進(jìn)行構(gòu)建的祝迂。
原文鏈接：https://jue.leheavengame.com/article/6056e7cb937a725c2e4019c2
