優化可以從哪些方面入手

1、優化開發體驗

• 優化構建速度，專案龐大時構建的耗時比較久
• 優化使用體驗，通過自動化手段完成一些重複工作

2、優化輸出質量

• 減少使用者感知到的載入時間，即首屏載入時間
• 提升流暢度，即提升程式碼效能

webpack 可以做哪些優化

1、縮小檔案搜尋範圍webpack 在啟動後會從配置的 Entry 出發，解析出檔案中的匯入語句，再遞迴解析，在遇到匯入語句時，webpack 會做一下操作

• 尋找對應的匯入檔案
• 使用配置中的 Loader 去處理檔案，例如解析 js 檔案用的 babel-loader

1.1 優化 Loader配置可通過 test, include,exclude 三個配置進行優化

1.2 優化 resolve.modules 配置webpack 在啟動後會從配置的入口模組出發找出所有依賴的模組，resolve 配置 webpack 如何尋找模組對應的檔案。resolve.modules 的預設值是 ['node_modules'], 指先去當前目錄的./node_modules 目錄下找對應的模組，如果沒有找到，就去上一級目錄../node_modules, 層層往上找。一般我們安裝的第三方目錄都會放在專案的根目錄 ./node_modules 目錄下，可以指明第三方模組的絕對路徑，減少查詢路徑