本篇內(nèi)容主要講解“react antd沒有樣式如何解決”,感興趣的朋友不妨來看看。本文介紹的方法操作簡(jiǎn)單快捷,實(shí)用性強(qiáng)。下面就讓小編來帶大家學(xué)習(xí)“react antd沒有樣式如何解決”吧!
創(chuàng)新互聯(lián)專注于企業(yè)營(yíng)銷型網(wǎng)站建設(shè)、網(wǎng)站重做改版、蘭西網(wǎng)站定制設(shè)計(jì)、自適應(yīng)品牌網(wǎng)站建設(shè)、html5、商城系統(tǒng)網(wǎng)站開發(fā)、集團(tuán)公司官網(wǎng)建設(shè)、外貿(mào)網(wǎng)站建設(shè)、高端網(wǎng)站制作、響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)等建站業(yè)務(wù),價(jià)格優(yōu)惠性價(jià)比高,為蘭西等各大城市提供網(wǎng)站開發(fā)制作服務(wù)。
react antd沒有樣式的解決辦法:1、在項(xiàng)目最外層組件引入antd樣式包,方式如“@import '~antd/dist/antd.css';”;2、在webpack配置中引入“ ['import', { libraryName: 'antd', style: 'css' }],”。
react項(xiàng)目引入antd組件沒有樣式的問題
明顯是antd的樣式文件沒有引入進(jìn)來,有兩種方式解決:
1.在項(xiàng)目最外層組件引入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 則默認(rèn)引入less
['import', { libraryName: 'antd', style: 'css' }],
]
}
}
]
},
plugins: [
new HtmlWebpackPlugin({
template: path.join(srcPath, 'index.html'),
filename: 'index.html'
})
]
}
到此,相信大家對(duì)“react antd沒有樣式如何解決”有了更深的了解,不妨來實(shí)際操作一番吧!這里是創(chuàng)新互聯(lián)網(wǎng)站,更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢,關(guān)注我們,繼續(xù)學(xué)習(xí)!
新聞名稱:reactantd沒有樣式如何解決
瀏覽地址:http://www.chinadenli.net/article44/ppjphe.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站制作、商城網(wǎng)站、App設(shè)計(jì)、網(wǎng)站營(yíng)銷、網(wǎng)站收錄、小程序開發(fā)
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)