歡迎您光臨本站 註冊首頁

讓IDE識別webpack的別名alias的實現方法

←手機掃碼閱讀     hongdian2012 @ 2020-05-09 , reply:0

許多項目腳手架默認就會把src目錄添加一個 @ 別名,項目中實際引入時,雖然可以精簡路徑,但也帶來一個很麻煩的問題:
IDE無法識別這些別名,因此導致無法自動完成路徑、無法識別引用資源的輸出、出現不必要的告警等情況。
偶然發現vscode的web項目裡有一個 jsconfig.json 文件,如:
{ "compilerOptions": { "baseUrl": ".", "paths": { "@/*": ["src/*"] }, "target": "ES6", "module": "commonjs", "allowSyntheticDefaultImports": true }, "include": ["src/**/*"], "exclude": ["node_modules"] }
只要有這個文件,vscode就可以正常識別出別名了。
後來發現JetBrains家的IDE更簡單,配置指定一下就行:
在項目設置的webpack標籤頁裡,將配置文件指向

/node_modules/@vue/cli-service/webpack.config.js 即可。
保存並重新打開項目以後,不只 src ,所有的別名比如 utils 等等都可以被正常識別。
其實這都已經寫在 vue-cli3 的文檔裡了,只是原始表述不太直觀,被我一直忽略了。


[hongdian2012 ] 讓IDE識別webpack的別名alias的實現方法已經有143次圍觀

http://coctec.com/docs/developer/show-post-233419.html