webpack4.x打包时 在a.js中require b.js时,把b.js中引入的css打包到了a.js引入的css中怎么回事?
以下是webpack.config.js配置
请各位大佬指点
const path = require('path');
const htmlWebpackPlugin = require('html-webpack-plugin');
const cleanWebpackPlugin = require('clean-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");//提取css到单独文件的插件
const ExtractTextPlugin = require("extract-text-webpack-plugin");
var getHtmlConfig = function (filename,title) {
return {
template:'./src/' + filename + '/'+ filename + '.html',
filename: filename + '.html',
title:title,
hash:true,
chunks:[filename]
}
}
module.exports = {
entry: {
index:'./src/index/index.js',
test:'./src/test/test.js'
},
output: {
filename: './js/[name].bundle.js',
path: path.resolve(__dirname,'dist'),
},
devServer:{
contentBase: './dist'
},
plugins: [
new htmlWebpackPlugin(getHtmlConfig("index",'index')),
new htmlWebpackPlugin(getHtmlConfig("test",'test')),
new cleanWebpackPlugin(['dist'])
],
module:{
rules:[
{
test:/\.css$/,
use:ExtractTextPlugin.extract({
fallback: "style-loader",
use: "css-loader"
})
},
{
test:/\.(png|svg|jpg|gif)$/,
use:[
'file-loader'
]
},
{
test: /\.(woff|woff2|eot|ttf|otf)$/,
use:[
'file-loader'
]
}
]
}