1.刪除無用的css
2.壓縮
3.eslint：檢驗**（不建議使用）
安裝：eslint eslint-loader
4.tree-shaking &scopehosting(生產環境下)
將沒用的內容過濾掉
在package.json中去配置sideeffects（唯一乙個在package.json中配置的）
配置的時候要注意要把css檔案排除在外，否則它會把沒用到的css檔案也過濾掉
5.懶載入（動態載入模組）
webpackprefetch：利用瀏覽器空閒時間，把動態模組載入完成並引入進來
webpackpreload：跟主模組的**同時進行載入
這兩個屬性都是用在 import() 中，例如 import(/* webpackpreload:true*/『main』)
6.source（**排查）
7.打包檔案分析工具（生產環境下使用）
安裝 webpack-bundle-analyzer
然後去配置檔案 webpack.config.js 中進行配置
8.resolve解析（直接去webpack.config.js配置，不需要安裝什麼）
9.include/exclude
指定哪些檔案通過或不通過loader解析
例如：指定 node_modules檔案下的js不需要loader解析
webpack學習之路之webpack核心概念
webpack相關文件 webpack官網 webpack中文官網 webpack github位址 webpack 版本差異及修復bug webpack 主要4個核心概念 1 entry entry是某一段 的入口，這段 入口會告訴webpack 裡面有哪些模組的依賴。entry也是打包的入口，告...
webpack學習之webpack基本配置
壓縮檔案 分割 提取公用 模組合併 把多個模組合併 自動重新整理 熱更新 改變，自動重新整理頁面 由於外掛程式可以攜帶引數 選項，必須在 webpack 配置中，向 plugins 屬性傳入的是外掛程式的例項。let require clean webpack plguin new cleanweb...
webpack學習篇 效能優化
我們的目標如下 1.優化打包速度 2.優化 除錯 1.優化 打包速度 2.優化 執行效能 作用 乙個模組發生變化，只會重新打包這乙個模組 而不是打包所有模組 極大提公升構建速度 devserver 可以使用hmr功能 因為style loader內部實現了 預設不能使用hmr功能 需要修改js 新增...