webpack 分离css问题

//下面的是对create-react-app配置中对css的配置
constcssFilename='static/css/[name].[contenthash:8].css';
constextractTextPluginOptions=shouldUseRelativeAssetPaths?
{publicPath:Array(cssFilename.split('/').length).join('../')}:{};
{
test:/\.css$/,
loader:ExtractTextPlugin.extract(
Object.assign(
{
fallback:require.resolve('style-loader'),
use:[
{
loader:require.resolve('css-loader'),
options:{
importLoaders:1,
minimize:true,
sourceMap:true,
},
},
{
loader:require.resolve('postcss-loader'),
options:{
ident:'postcss',//https://webpack.js.org/guides/migrating/#complex-options
plugins:()=>[
require('postcss-flexbugs-fixes'),
autoprefixer({
browsers:[
'>1%',
'last4versions',
'FirefoxESR',
'notie<9',//Reactdoesn'tsupportIE8anyway
],
flexbox:'no-2009',
}),
],
},
},
],
},
extractTextPluginOptions
)
),
//Note:thiswon'tworkwithout`newExtractTextPlugin()`in`plugins`.
},
newExtractTextPlugin({
filename:cssFilename,
}),
这个配置打包分离出来的css都只有main.css一个文件,怎样才能把引入的css,
比如comm.css;header.css这种单独的css分离出来呢
呼啦一阵风
浏览 534回答 2
2回答

拉风的咖菲猫

开头引入constwebpack=require("webpack");constExtractTextPlugin=require("extract-text-webpack-plugin");//...然后webpack({entry:{//...},output:{//...},module:{rules:[{test:/\.css$/,include:[path.resolve(__dirname,"./css")],use:ExtractTextPlugin.extract({fallback:"style-loader",use:['css-loader?minimize=true']})}//...]},plugins:[//...newExtractTextPlugin('min.css')//CSS就在该文件下]});
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript