通过@代替src路径,方便开发过程中的路径查找访问
如何配置:
- 路径转换,修改webpack别名路径配置craco
- 配置craco工具包
npm i @craco/craco -D
- 根目录下创建craco.config.js配置文件
// 扩展webpack的配置
const path = require('path')
module.exports = {
// webpack 配置
webpack: {
alias: {
// 约定:使用@表示src文件所在路径
'@': path.resolve(__dirname, 'src')
}
}
}
-
修改scripts命令
- 测试
// "@/pages/Login" = "src/pages/Login"
npm start
- VSCode联想提示,修改VSCode配置jsconfig.json
- 在项目根目录创建jsconfig.json 配置文件
{
"compilerOptions": {
"baseUrl": "./",
"paths": {
"@/*": [
"src/*"
]
}
}
}