這是我第一次配置這些，沒有學過webpack,出過很錯，還好后來都一一改正。我覺得我遇到的大部分問題就是版本更新了，和老師教的時候用的有一些不一樣，但是我想盡量不要去直接將那些包的版本降低，最好還是使用高版本的包。

1.安裝less-loader和less，語句：yarn add less-loader less 或者 npm install less-loader less

2.在項目終端使用：yarn run eject

暴露webpack （如果問是否要暴露，輸入y就行了）

3.在編譯器的項目文件夾中會多出來config文件，文件目錄下會有webpack.config.js文件（版本低的會出現webpack.config.dev.js和webpack.config.prod.js，這種的配置方法百度上挺多的，我這里就只記錄一下webpack.config.js）

4.點開webpack.config.js文件（我也不知道里面寫的是什么）現在要修改里面的內容了

1）https://ant.design/docs/react/customize-theme-cn是antD的主題定制頁面，我覺得里面的方法應該算是最新的

2）點開鏈接可以找到這樣的一段代碼，將大的綠框出來的代碼粘貼復制出來，在webpack.config.js找到和這段被復制的代碼格式差不多的地方，粘貼這段代碼（注意這段代碼要用{}包起來），紅框的地方是用來做定制主題的，所以里面代碼看項目需不需要了

保存后再重啟，less就配置好了，就可以在項目中使用.less文件了。

轉載于:https://juejin.im/post/5c794ce3f265da2dd53fe05c

總結

以上是生活随笔為你收集整理的react中webpack.config.js配置lessless-loader less的全部內容，希望文章能夠幫你解決所遇到的問題。

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