【React】CRACO 重写 React 配置

eject 命令可以是将 cra 配置完全暴露出来，但这是一个不可逆的操作，同时也会失去CRA带来的便利和后续升级。所以我们可以选择 craco 重写 react 配置。

Getting Started | CRACO
craco 是专门由于 cra 配置的重写，扩展配置 cra （webpack）。

详细重写 cra 配置可以看这篇博客：react 使用 craco 重写配置

1. 安装依赖

   npm i -D @craco/craco
   

2. 根目录下创建 craco.config.js 和配置 configure:

     my-app
     ├── node_modules
   + ├── craco.config.js
     └── package.json
   

   craco.config.js

   module.exports = {
       devServer: {
           proxy: {
               '/api': {
                   target: 'http://localhost:3000',
                   changeOrigin: true,
               }
           },
           port: 5173
       }
   }
   

3. 脚本更改:

   package.json

   "scripts": {
   -  "start": "react-scripts start"
   +  "start": "craco start"
   -  "build": "react-scripts build"
   +  "build": "craco build"
   -  "test": "react-scripts test"
   +  "test": "craco test"
   }