react 后台（一）react + redux + react-route + webpack+ axios + antd+styled-components（替代less）...

墨蓝 2021-11-02 10:26 219阅读 0赞

### `create-react-app my-admin` ###

## 项目技术栈 ##

react + redux + react-route + webpack+ axios + antd+styled-components（替代less）

yarn add antd

yarn add axios

yarn add react-redux

yarn add react-router

yarn add react-router-dom

yarn add react-router-redux

yarn add redux

yarn add redux-actions

yarn add redux-mock-store

yarn add redux-thunk

yarn add immutable

yarn add redux-immutable

yarn add styled-components

yarn add echarts

yarn add react-app-rewired

yarn add customize-cra

修改

"scripts": {
        "start": "react-scripts start",
        "build": "react-scripts build",
        "test": "react-scripts test",
        "eject": "react-scripts eject"
      },

改为

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

创建文件 config-overrides.js

const { override, fixBabelImports } = require('customize-cra');
    module.exports = override(
      fixBabelImports('import', {
        libraryName: 'antd',
        libraryDirectory: 'es',
        style: 'css',
      }),
    );

如果要修改主题色

const { override, fixBabelImports, addLessLoader } = require('customize-cra');
    
    module.exports = override(
      fixBabelImports('import', {
        libraryName: 'antd',
        libraryDirectory: 'es',
    
       style: true,
      }),
     addLessLoader({
       javascriptEnabled: true,
       modifyVars: { '@primary-color': '#1DA57A' },
     }),
    );

可以运行

npm start

转载于:https://www.cnblogs.com/dianzan/p/11302108.html