creat-react-app 二次配置

react-Echarts(以及react-webpack重新配置)

1、创建项目

npx create-react-app 项目名

2、重新配置

1、
eject 项目 ,把项目的所有webpack配置暴露出来，但是这个操作时不可逆的。然后就可以进行webpack进行配置了。
2、
安装 react-app-rewired 并修改 package.json 里的启动配置。由于新的 react-app-rewired@2.x 版本的关系，你需要还需要安装 customize-cra。

具体的配置去react-app-rewired和customize-cra 官网查看
https://github.com/arackaf/customize-cra/blob/master/api.md 更多api

npm install react-app-rewired customize-cra --save-dev

• 修改package.json

    "scripts": {
    -   "start": "react-scripts start",
    +   "start": "react-app-rewired start",
    -   "build": "react-scripts build",
    +   "build": "react-app-rewired build",
    -   "test": "react-scripts test --env=jsdom",
    +   "test": "react-app-rewired test --env=jsdom",
    }

• 然后在项目根目录创建一个 config-overrides.js 用于修改默认配置。

const { override, fixBabelImports } = require('customize-cra');
 module.exports = override( //用于配置anr-design
  fixBabelImports('import', {
    libraryName: 'antd-mobile',
    style: 'css',
   }),
   addWebpackAlias({//配置别名
     '@'：path.resolve(__dirname,'./src/components')
   })
 );

3、载入Echarts

• 安装第三方库 echarts-for-react 以及安装本身的echarts
  具体使用参照echarts-for-react官网