create-react-app创建的项目中设置webpack配置

 create-react-app 创建的项目默认使用的是 react-scripts（存在于node_modules文件夹中）来处理开发服务器和构建，它内置了一些webpack相关配置。一般不会暴露出来给开发者，但是在有些情况下我们需要修改下webpack默认配置，如修改outputPath、sourcemap方案等，但由于 eject是不可逆的，所以craco插件应运而生，为我们提供了更好的解决方案。

craco（Create React App Configuration Override）用来自定义由 create-react-app 创建的项目内部配置，比如修改 webpack 配置，覆盖react-scripts的默认设置。

安装：

npm install  @craco/craco react-app-rewire-alias（建议安装在dependencies中）

 配置：

 在项目根目录下创建 craco.config.js 文件，并且在package.json文件中修改一些配置如下：

// 将如下模块代码
"scripts": {"start": "react-scripts start","build": "react-scripts  build","test": "react-scripts  test","eject": "react-scripts eject"},
// 换成
"scripts": {"start": "craco start","build": "craco build","test": "craco test","eject": "react-scripts eject"},

 craco.config.js 文件配置：

const path = require("path");
const { CracoAliasPlugin } = require("react-app-rewire-alias");module.exports = {// webpack 配置webpack: {// 配置内容},// 配置别名plugins: [// 配置内容],
};

以上配置完成后重启项目