react 项目配置别名路径@

1. 安装修改 CRA 配置的包

yarn add -D @craco/craco

2. 在项目根目录中创建 craco 的配置文件：craco.config.js

const path = require('path')module.exports = {// webpack 配置webpack: {// 配置别名alias: {// 约定：使用 @ 表示 src 文件所在路径'@': path.resolve(__dirname, 'src')}}
}

3. 修改 package.json 中的脚本命令

// 将 start/build/test 三个命令修改为 craco 方式
"scripts": {"start": "craco start","build": "craco build","test": "craco test","eject": "react-scripts eject"
}

4. @别名路径提示

//根目录创建 jsconfig.json 配置文件
{"compilerOptions": {"baseUrl": "./","paths": {"@/*": ["src/*"]}}
}