所属分类：web前端开发
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中最上面加
微博登录
QQ登录@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没有样式怎么办的详细内容，更多请关注zzsucai.com其它相关文章！
