Webpack.config
var path = require('path');
var glob = require('glob');
var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var config = {
entry: {
post: "./post",
about: "./about"
},
output: {
path: path.join(__dirname, './dist'),
filename: '[name].js',
publicPath: './dist/',
chunkFilename: '[id].chunk.js'
},
module: {
loaders: [{
test: /\.js?$/,
loader: 'babel',
query: {
presets: ['es2015']
},
exclude: /node_modules/
}, {
test: /\.css$/,
loader: ExtractTextPlugin.extract("style-loader", "css-loader")
}, {
test: /\.less$/,
loader: ExtractTextPlugin.extract("style-loader", "css-loader!less-loader")
}, {
test: /\.(png|jpe?g|gif)$/,
loader: 'url-loader?limit=8192&name=imgs/[name]-[hash].[ext]'
}]
},
plugins: [
new ExtractTextPlugin("app.css", {
allChunks: true
})
]
};
module.exports = config;
post.js
require('./post.css');
post.css
.post {
width: 100px;
height: 100px;
}
about.js
require('./about.css');
about.css
.about {
font-size: 12px;
}
使用了 ExtractTextPlugin, 最后生成了一个 app.css
.post {
width: 100px;
height: 100px;
}
好像只把post.css的内容打包进去,如何配置可以同时把post.css和about.css打包到app.css
.about {
font-size: 12px;
}
.post {
width: 100px;
height: 100px;
}