首先，讓我想說的是，現在有很多的更新，網上的一些也有的沒用了，

接下來讓我來分享一些我的解決方法，時間：2018.12/18.

1.和網上的一樣，我用的是creat-react-app創建的項目，修改主題的方式也是用的：run eject后的項目結構的webpack.config.dev.js修改

第一步：

yarn run eject

　或者

npm run eject　　

然后在目錄結構就會多一個文件夾

我們要修改的webpack.config.dev.js（開發時）和webpack.config.prod.js（打包時）文件，

但是還要下載幾個插件

1.下載babel-plugin-import

2.下載less和less-loader?

1.npm install babel-plugin-import -s或者 yarn add babel-plugin-import

　　

2. npm install -s less//less-loader npm install --save-dev less-loader less或者yarn add less//less-loaderyarn add less-loader

　　3.類似下載第三方插件的事就不多說了 進入正題。

1.打開webpack.config.dev.js

如圖

先嘮叨一下，網上有很多的過時了，比如修改

test: /\.(css)$/,

的，你會發現，根本沒有，結構都變了

那是因為

test: /\.(css)$/,

都寫成了這樣

我也是被坑的很慘，我為此找了好多文檔，終于總結出來了，開始

下載好之后，找到這個位置把 plugins改成如下

?

"plugins": [["import", {"libraryName": "antd", "libraryDirectory":"es", "style": true}],[

　　然后ctrl+F 在搜索欄中輸入exclude 在exclude中加入/\.less$/,

?

最后在找到這個位置在rules中的use[]后面加入代碼如圖

{test: /\.less$/,//include: paths.appSrc,use: [{loader: "style-loader" // creates style nodes from JS strings}, {loader: "css-loader" // translates CSS into CommonJS}, {loader: "less-loader",// compiles Less to CSSoptions: {sourceMap: true,modifyVars: {'primary-color': '#1DA57A','link-color': '#1DA57A','border-radius-base': '2px',},javascriptEnabled: true,}}]},

　　最后重啟，效果如圖

如果此報錯

網上的，我也有這個錯誤，如果沒加/\.less$/,也會包這個錯誤

?

?

?

轉載于:https://www.cnblogs.com/zlf888/p/10136535.html

總結

以上是生活随笔為你收集整理的Antd 修改主题颜色2018 最新版 填坑记录的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。