webpack構建工具常見問題及解決方法

webpack構建工具常見問題及解決方法

  在運用webpack開發項目的時候經常會遇到各種各樣的問題，我對實際開發項目中實際遇到的一些問題
  進行總結，希望能幫助到大家。    

  

1. 構建需要的包未添加依賴報錯

Module not found:"xxx(例：react)" in "項目文件"

  
這種情況是由於"xxx(例：react)"未添加依賴，解決辦法如下：
  

npm install xxx(react) --save 或  yarn add xxx(react) 

  

2. 構建過程中依賴包版本不兼容報錯

  
Failed to minify the bundle . Error : xxx from UglifyJs
  
這種情況一般出現在項目build過程中，解決辦法如下：
  

• 刪除項目中的node_modules文件夾，用npm或yarn重裝後，重新build：
    

  npm install 或 yarn install

• 依賴包之間版本不兼容，這需要回憶一下最近新添加的依賴包，對相對應的包進行升降版本(以yarn爲例)：
    

  yarn add xxx@[]  

  然後進行版本切換（以query-string爲例）：
    

  
    

最後重新build項目。
  

3. 錯寫，漏寫或書寫不規範導致的錯誤

    SynatxError:Unexpected identifier

  出現這種錯誤，一般是因爲js代碼中書寫不規範造成錯誤（例：符號缺失、格式不正確或手抖刪除了些代碼都是有可能的），仔細檢查下代碼是可以避免的。