1. 程式人生 > 其它 >配置antd 主題顏色 和 別名

配置antd 主題顏色 和 別名


yarn add antd
yarn add @ant-design/icons
yarn add moment

// 配置andt 主題
yarn add @craco/craco
// 修改配置命令
"scripts": {
"start": "craco start",
"build": "craco build",
"test": "craco test",
"eject": "react-scripts eject"
},

yarn add craco-less

scr 同級目錄建立 craco.config.js
const CracoLessPlugin = require('craco-less');
module.exports = {
plugins:[
{
plugin:CracoLessPlugin,
options:{
lessLoaderOptions:{
lessOptions:{
modifyVars:{'@primary-color':"#1da57a"},
javascriptEnabled:true
}
}
}
}
]
}
// 引入 antd less
import 'antd/dist/antd.less';
重啟專案 配置成功


// 配置別名
const CracoLessPlugin = require('craco-less');
const path = require('path');
const resolve = dir => path.resolve(__dirname,dir);

module.exports = {
plugins:[
{
plugin:CracoLessPlugin,
options:{
lessLoaderOptions:{
lessOptions:{
modifyVars:{'@primary-color':"#1da57a"}, // 配置主題顏色
javascriptEnabled:true
}
}
}
}
],
webpack:{
alias:{
"@":resolve("src"),
"components":resolve("src/components"),
}
}
}

我是Eric,手機號是13522679763