react antd没有样式的解决办法:1、在项目最外层组件引入antd样式包,方式如“@import '~antd/dist/antd.css';”;2、在webpack配置中引入“ ['import', { libraryName: 'antd', style: 'css' }],”。
本教程操作环境:Windows10系统、react18.0.0版、Dell G3电脑。
react antd没有样式怎么办?
react项目引入antd组件没有样式的问题
明显是antd的样式文件没有引入进来,有两种方式解决:
1.在项目最外层组件引入antd样式包
如在App.css中最上面加
@import '~antd/dist/antd.css';
2.webpack配置引入
module.exports = { entry: { index: path.join(srcPath, 'index.js'), }, module: { rules: [ // babel-loader { test: /\.(js|jsx)$/, loader: ['babel-loader?cacheDirectory'],// 开启缓存 include: srcPath, // exclude: /node_modules/ loader: require.resolve('babel-loader'), options: { plugins: [ // 引入样式为 css // style为true 则默认引入less ['import', { libraryName: 'antd', style: 'css' }], ] } } ] }, plugins: [ new HtmlWebpackPlugin({ template: path.join(srcPath, 'index.html'), filename: 'index.html' }) ] }
推荐学习:《react视频教程》
以上是react antd没有样式怎么办的详细内容。更多信息请关注PHP中文网其他相关文章!