/**
- Created by z674144 on 2019/3/25 */ const HtmlWebpackPlugin = require('html-webpack-plugin'); const merge = require('webpack-merge'); const MiniCssExtractPlugin = require('mini-css-extract-plugin'); const common = require('./webpack.common.config.js').common; const autoPreFixer = require('autoprefixer'); const packageInfo = require('../package.json'); const CopyWebpackPlugin = require('copy-webpack-plugin'); const TerserPlugin = require('terser-webpack-plugin'); const path = require('path');
module.exports = merge(common, {
mode: 'production',
module: {
rules: [
{
test: /.(styl|stylus)/,
exclude: /node_modules/,
use: [
{
loader: MiniCssExtractPlugin.loader,
options: {
// you can specify a publicPath here
// by default it use publicPath in webpackOptions.output
publicPath: '../'
},
},
{
loader: 'css-loader',
options: {
import: true,
},
},
{
loader: 'postcss-loader',
options: {
plugins: function () {
return [autoPreFixer];
}
}
},
'stylus-loader'
]
},
{
test: /\.(css)/,
exclude: /node_modules/,
use: [
{
loader: MiniCssExtractPlugin.loader,
options: {
// you can specify a publicPath here
// by default it use publicPath in webpackOptions.output
publicPath: '../'
}
},
{
loader: 'css-loader',
options: {
import: true // Enable/Disable @import handling
}
},
{
loader: 'postcss-loader',
options: {
plugins: function () {
return [autoPreFixer];
}
}
}
]
}]
},
optimization: {
splitChunks: {
cacheGroups: {
commons: {
chunks: "initial",
minChunks: 2,
maxInitialRequests: 5, // The default limit is too small to showcase the effect
minSize: 0 // This is example is too small to create commons chunks
},
vendor: {
test: /[\/]node_modules[\/]/,
chunks: "initial",
name: "vendor",
priority: 10,
enforce: true
}
}
},
minimizer: [
new TerserPlugin({
sourceMap: true, // Must be set to true if using source-maps in production
terserOptions: {
compress: {
drop_console: true,
},
},
}),
],
namedChunks: true,
moduleIds: 'hashed',
runtimeChunk: "single"
},
plugins: [
new HtmlWebpackPlugin({
template: path.resolve(__dirname, '../src/index.ejs'),
inject: true,
customVariable: {
urlBase: /${packageInfo.name}/,
fontUrl: ./assets/font/font.css
},
minify: {
removeComments: true,
collapseWhitespace: true,
removeAttributeQuotes: false
}
}),
new MiniCssExtractPlugin({
// Options similar to the same options in webpackOptions.output
// both options are optional
filename: 'css/[name]-[contenthash:12].css',
chunkFilename: 'css/[id].[contenthash:12].css' // use contenthash *
}),
new CopyWebpackPlugin([
{
from: path.resolve(__dirname, '../src/health.html'),
to: path.resolve(__dirname, '../output/health.html')
},
{
from: path.resolve(__dirname, '../src/assets/'),
to: path.resolve(__dirname, '../output/assets/')
}
])
]
});
