Vite 含著金鑰匙出生的構(gòu)建工具

企業(yè)項(xiàng)目一般有哪些功能

1 typescript

2 vue react 集成 // jsx 語法如何解析

// vue-compile react-compile

3 less/sass/component-style //less-loader sass-loader // 樣式處理其

4 babel 集成 // 瀏覽器低版本瀏覽器的語法糖的支持

5 代碼體積優(yōu)化 uglifyjs 將代碼壓縮成性能更高的文件 。 壓縮文件 / 代碼分割/優(yōu)化開發(fā)體驗(yàn)（熱模塊開發(fā)代碼）

6 模塊化開發(fā)支持 支持node_modules 直接導(dǎo)入代碼 ，多種模塊化方式的導(dǎo)入。

commonjs / es_module

// 處理代碼的兼容性： 構(gòu)建工具都這些語法處理器導(dǎo)入進(jìn)來自動(dòng)處理

構(gòu)建工具將這些事情都我們做了，我們只需要關(guān)注我們支持的代碼。

// 構(gòu)建的工具幫我們集成工作。 所有臟活累活構(gòu)建工具幫我們搞好了哈哈哈

// webpack vite

// 從入口文件出發(fā) 分析其文件加載方式 遞歸的讀取所有的文件，隨著業(yè)務(wù)代碼越來越多，構(gòu)建速度也會(huì)大幅度的下降。不過webpack 在兼容性方面還是很厲害，vite 主要是瀏覽器環(huán)境，需要支持es_module規(guī)范。

// vite 關(guān)注瀏覽器的開發(fā)體驗(yàn)。

yarn create vite // 腳手架

// vite 的 預(yù)加載

依賴預(yù)構(gòu)建 可以解決網(wǎng)絡(luò)中間多包傳輸?shù)膯栴}。

依賴預(yù)構(gòu)建 // 重要的一批。