通過@代替src路徑洁奈,方便開發(fā)過程中的路徑查找訪問
如何配置:
- 路徑轉(zhuǎn)換谆刨,修改webpack別名路徑配置craco
- 配置craco工具包
npm i @craco/craco -D
- 根目錄下創(chuàng)建craco.config.js配置文件
// 擴展webpack的配置
const path = require('path')
module.exports = {
// webpack 配置
webpack: {
alias: {
// 約定:使用@表示src文件所在路徑
'@': path.resolve(__dirname, 'src')
}
}
}
-
修改scripts命令
image.png - 測試
// "@/pages/Login" = "src/pages/Login"
npm start
- VSCode聯(lián)想提示,修改VSCode配置jsconfig.json
- 在項目根目錄創(chuàng)建jsconfig.json 配置文件
{
"compilerOptions": {
"baseUrl": "./",
"paths": {
"@/*": [
"src/*"
]
}
}
}