react環境初始化配置antd-主題

先初始化各種依賴包，可選，不需要的刪除

npm install react-router react-router-dom less less-loader antd react-redux --save

一般 import 'antd/dist/antd.css' 引入

 

antd高級引入-按需加載

1.安裝craco

npm install @craco/craco --save

 安裝less

npm install craco-less --save

 

2.修改package.json

 

 3.增加配置文件craco.config.js

const CracoLessPlugin = require('craco-less');

module.exports = {
  plugins: [
    {
      plugin: CracoLessPlugin,
      options: {
        lessLoaderOptions: {
          lessOptions: {
            modifyVars: { '@primary-color': '#1DA57A' },
            javascriptEnabled: true,
          },
        },
      },
    },
  ],
};

最后把import 'antd/dist/antd.css'

改成import 'antd/dist/antd.less‘

重新啟動按鈕變顏色即可