爲什麼別名在我的配置下無法正確解析？

我有我的WebPack配置跟隨resolve選項：爲什麼別名在我的配置下無法正確解析？

resolve: { 
    modules: ["./app/static/js/homepage/", "./app/static/js/dashboard/",], 
    extensions: [".js", ], 
    alias: { 
     "bootstrap": "../../bower_components/bootstrap/dist/js/bootstrap", 
     "lodash": "../../bower_components/lodash/lodash", 
    // ...

，但我得到這個錯誤：

ERROR in ./app/static/js/dashboard/main.js 
Module not found: Error: Can't resolve 'underscore' in '/app/app/static/js/dashboard' 
@ ./app/static/js/dashboard/main.js 84:0-112:2

這意味着它不把underscore作爲別名，這恰好都define s在我的項目中。

來源

2017-02-20 Ivan

你是他們混疊相對路徑，你去了兩個目錄（與../../），所以當你在./app/static/js/dashboard/main.js導入lodash，它會嘗試找到

./app/static/bower_components/lodash/lodash

模塊假設你bower_components在項目的頂部水平（建議），您可以進入四個目錄修復別名：

alias: { 
    "bootstrap": "../../../../bower_components/bootstrap/dist/js/bootstrap", 
    "lodash": "../../../../bower_components/lodash/lodash", 
}

注意，如果你在一個文件，它是導入這隻會工作四層深。用絕對路徑代替它們可以在任何地方工作。

一個更清潔的解決方案是將bower_components添加到您的模塊，因此它會在每個bower_component目錄中查找，這是將bower集成到webpack的常用方法。有了這個，你可以使用import _ from 'lodash/lodash'而不添加任何別名。但是如果你仍然想要別名，你可以這樣做：

resolve: { 
    modules: ["bower_components"], 
    extensions: [".js"], 
    alias: { 
    "bootstrap": "bootstrap/dist/js/bootstrap", 
    "lodash": "lodash/lodash", 
    } 
}

來源

2017-02-20 15:56:10

將「bower_componenets」添加到模塊修復它。我確信我的路徑由於某種原因是正確的=） – Ivan

爲什麼別名在我的配置下無法正確解析？

回答

相關問題