創建
webpack.intellij.js
專案root目錄下,創建一個webpack.intellij.js
,這個檔案將會被WebStorm用來辨識Webpack的配置,包括alias(路徑別名)。配置
webpack.intellij.js
alias換成你自己的,可直接複製webpack.config的aliasconst path = require("path"); module.exports = { resolve: { alias: { $DATA: path.resolve(__dirname, "./data"), $ACTIONS: path.resolve(__dirname, "./actions"), "@": path.resolve(__dirname, "./components"), }, }, };
WebStorm設置
- 打開 Settings
- Languages & Frameworks > JavaScript > Webpack。
- 選Manually,Configuration file選擇你剛剛的
webpack.intellij.js
- 重啟WebStrom
重新啟動WebStorm以確保新的設定生效
結語:
至此,我們已經成功完成了設定。若專案中alias用得多,最好還是配置一下讓WebStorm能識別alias。不僅能提升開發體驗,而且避免了未配置時,WebStorm解析alias太多的檔案可能會出現的 analyzing卡住 和 代碼highlight顯示異常問題。