-
Notifications
You must be signed in to change notification settings - Fork 1.9k
webpack antd配置
yezihaohao edited this page Feb 10, 2018
·
2 revisions
webpack.config.dev.js & webpack.config.prod.js两个配置文件增加相同的配置
rules中增加配置按需引入antd组件:
{
test: /\.(js|jsx)$/,
include: paths.appSrc,
loader: require.resolve('babel-loader'),
options: {
+plugins: [
+ ['import', [{ libraryName: 'antd', style: true }]]
+],
cacheDirectory: true,
},
}
增加编译less文件配置:
{
test: /\.less$/,
use: [
require.resolve('style-loader'),
{
loader: 'css-loader',
options: {
importLoaders: 1
},
},
{
loader: require.resolve('postcss-loader'),
options: {
ident: 'postcss', // https://webpack.js.org/guides/migrating/#complex-options
plugins: () => [
require('postcss-flexbugs-fixes'),
autoprefixer({
browsers: [
'>1%',
'last 4 versions',
'Firefox ESR',
'not ie < 9', // React doesn't support IE8 anyway
],
flexbox: 'no-2009',
}),
],
},
},
{
loader: require.resolve('less-loader'),
options: {
},
}
]
}
注意:安装相应的插件包:npm i less less-loader babel-plugin-import --dev 或者 yarn add less less-loader babel-plugin-import --dev