React项目使用@进行别名路径配置

step1 ：安装 @craco/craco进行扩展配置 ：npm i -D @craco/craco

step2 ：在根目录创建配置文件craco.config.js；

              craco.config.js文件代码：

const path=require('path');

module.exports={ webpack: { alias:

{ '@':path.resolve(__dirname,'src') }

} };

step3： 配置好之后在package.json中 更改启动命令 ：

   "scripts": {

                      "start": "craco start", "build": "craco build",

      }

step4 ：重启项目

step5 ：在src目录下创建test.js文件引入到src/index.js，用于测试；

const sum=(a,b)=>{ return a+b; };

export default sum;

step6 ：别名路径‘@’配置成功，但是输入'@/ '不会提示src下的文件路径，这时候需要配置联想路径

在根目录下创建jsconfig.json文件代码：

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