1,在一个项目中,如果在引入文件时, 频繁用 ../ ./ 会很繁琐,且不易维护
那么下面讲解如何在react中配置路径别名
1, 安装 react-app-rewired customize-cra
npm install react-app-rewired customize-cra --save-dev
2,在项目根目录也就是package.json平级目录,新建一个config-overrides.js文件
并在js文件中, 书写以下代码(为@根路径配置代码)
const { override, addWebpackAlias } = require("customize-cra")
const path = require("path");
module.exports=override(
//引入插件写相关配置
addWebpackAlias({
"@" : path.resolve(__dirname, "src")
})
)
3,在package.json更改 命令
"scripts": {
"dev": "react-app-rewired start",
"build": "react-app-rewired build",
"test": "react-app-rewired test",
"eject": "react-scripts eject"
},
4,view中使用
这样通过npm run dev 重启项目就可以了
