2018-11-26 01:51:26 -05:00
|
|
|
const path = require('path')
|
|
|
|
const HtmlWebpackPlugin = require('html-webpack-plugin')
|
2018-11-26 22:53:07 -05:00
|
|
|
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
|
2018-11-26 23:26:23 -05:00
|
|
|
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
|
|
|
|
const TerserPlugin = require('terser-webpack-plugin')
|
2018-11-26 22:53:07 -05:00
|
|
|
|
|
|
|
const mode = process.env.NODE_ENV || 'development'
|
2018-11-26 01:51:26 -05:00
|
|
|
|
|
|
|
module.exports = {
|
2018-11-26 23:26:23 -05:00
|
|
|
optimization: {
|
|
|
|
minimizer: [
|
|
|
|
new TerserPlugin({
|
|
|
|
cache: true,
|
|
|
|
extractComments: true,
|
|
|
|
parallel: true,
|
|
|
|
sourceMap: true
|
|
|
|
}),
|
|
|
|
new OptimizeCSSAssetsPlugin({})
|
|
|
|
]
|
|
|
|
},
|
2018-11-26 22:24:31 -05:00
|
|
|
entry: [
|
|
|
|
'core-js/fn/array/from',
|
|
|
|
'core-js/fn/array/includes',
|
|
|
|
'./src/app.js'
|
|
|
|
],
|
2018-11-26 22:53:07 -05:00
|
|
|
mode: mode,
|
2018-11-26 01:51:26 -05:00
|
|
|
output: {
|
|
|
|
filename: '[name].[contenthash].js',
|
|
|
|
path: path.resolve(__dirname, 'dist')
|
|
|
|
},
|
|
|
|
plugins: [
|
|
|
|
new HtmlWebpackPlugin({
|
2018-11-26 23:26:23 -05:00
|
|
|
template: 'src/index.html',
|
|
|
|
minify: mode === 'production' ? {
|
|
|
|
collapseWhitespace: true,
|
|
|
|
removeComments: true,
|
|
|
|
removeRedundantAttributes: true,
|
|
|
|
removeScriptTypeAttributes: true,
|
|
|
|
removeStyleLinkTypeAttributes: true,
|
|
|
|
useShortDoctype: true
|
|
|
|
} : false
|
2018-11-26 22:53:07 -05:00
|
|
|
}),
|
|
|
|
new MiniCssExtractPlugin({
|
|
|
|
filename: '[name].[contenthash].css'
|
2018-11-26 01:51:26 -05:00
|
|
|
})
|
|
|
|
],
|
|
|
|
module: {
|
|
|
|
rules: [
|
|
|
|
{
|
|
|
|
test: /\.html$/,
|
|
|
|
loader: 'html-loader',
|
|
|
|
options: {
|
|
|
|
interpolate: true
|
|
|
|
}
|
|
|
|
},
|
|
|
|
{
|
|
|
|
test: /\.(scss)$/,
|
|
|
|
use: [
|
|
|
|
{
|
2018-11-26 22:53:07 -05:00
|
|
|
loader: mode == 'production' ? MiniCssExtractPlugin.loader : 'style-loader'
|
2018-11-26 01:51:26 -05:00
|
|
|
},
|
|
|
|
{
|
|
|
|
// Interprets `@import` and `url()` like `import/require()` and will resolve them
|
|
|
|
loader: 'css-loader'
|
|
|
|
},
|
|
|
|
{
|
|
|
|
// Loader for webpack to process CSS with PostCSS
|
|
|
|
loader: 'postcss-loader',
|
|
|
|
options: {
|
|
|
|
plugins: function () {
|
|
|
|
return [
|
|
|
|
require('autoprefixer')
|
|
|
|
]
|
|
|
|
}
|
|
|
|
}
|
|
|
|
},
|
|
|
|
{
|
|
|
|
// Loads a SASS/SCSS file and compiles it to CSS
|
|
|
|
loader: 'sass-loader'
|
|
|
|
}
|
|
|
|
]
|
|
|
|
}
|
|
|
|
]
|
|
|
|
}
|
|
|
|
}
|