(資料圖片僅供參考)

本教程操作環(huán)境：Windows10系統(tǒng)、react18.0.0版、Dell G3電腦。

react引入antd報(bào)錯(cuò)怎么辦？React使用antd按需引入報(bào)錯(cuò)

引言

按照antd官網(wǎng)配置按需引入，還是出現(xiàn)一系列的報(bào)錯(cuò)：

原因

使用 babel-plugin-import

npm install babel-plugin-import --save-dev 或yarn add babel-plugin-import

配置package.json文件

"babel": {  "presets": [    "react-app"  ],  + "plugins": [  +  [  +    "import",  +   {  +      "libraryName": "antd",  +      "style": true  +    }  + ]  +]}

antd定制主題

當(dāng)把style設(shè)置為true之后，運(yùn)行項(xiàng)目都會(huì)重新打包antd的less文件，加載最新的樣式文件。在webpack.config.js文件中找到getStyleLoaders()函數(shù)，加入以下代碼，在modifyVars中定制我們的主題。

推薦學(xué)習(xí)：《react視頻教程》

以上就是react引入antd報(bào)錯(cuò)怎么辦的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注php中文網(wǎng)其它相關(guān)文章！

關(guān)鍵詞： antd React