配置别名路径 @

CRA本身把webpack配置包装到了黑盒里无法直接修改，需要借助一个插件 - craco

1. 路径解析配置（Webpack）-- craco 插件

把 @/ 解析为 src/

 配置步骤：

1.安装 craco

npm i -D @craco/craco

2. 项目根目录下创建配置文件 

     craco.config.js

3. 配置文件中添加路径解析配置

const path = require("path");module.exports = {// webpack 配置webpack: {// 配置别名alias: {"@": path.resolve(__dirname, "src"),},},
};

4. 包文件中配置启动和打包命令

  "scripts": {"start": "craco start","build": "craco build",}

2. 路径联想配置（VsCode）-- jsconfig.json

VsCode在输入 @/ 时，自动联想出对应的 src/ 下的子级目录

{"compilerOptions": {"baseUrl": "./","paths": {"@/*": ["src/*"]}}
}