vue路由懶加載,babel-loader無法處理/使用 import


使用vue-router懶加載,代碼如下:

但是npm run dev 的時候 babel-loader報錯如下:

查閱各種資料終於解決。

問題原因:

這種情況下的 import 屬於異步引用組件,需要特殊的babel-loader處理。

解決方法:

先安裝babel用來編譯import異步引用方法的模塊 babel-plugin-syntax-dynamic-import

cnpm install babel-plugin-syntax-dynamic-import -D

在.bablerc中引入syntax-dynamic-import插件

  {
    "presets": ["env"],
    "plugins": ["syntax-dynamic-import"]
  }

參考資料:

https://webpack.docschina.org/guides/code-splitting/#動態導入-dynamic-imports-

https://segmentfault.com/q/1010000011576199

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM