125 lines
2.9 KiB
JavaScript
Executable File
125 lines
2.9 KiB
JavaScript
Executable File
const path = require('path')
|
|
const glob = require('glob')
|
|
const webpack = require('webpack')
|
|
const TerserPlugin = require('terser-webpack-plugin')
|
|
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
|
|
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
|
|
const PurgecssPlugin = require('purgecss-webpack-plugin')
|
|
const HtmlWebPackPlugin = require('html-webpack-plugin')
|
|
const FaviconsWebpackPlugin = require('favicons-webpack-plugin')
|
|
const OpenBrowserPlugin = require('opn-browser-webpack-plugin')
|
|
|
|
module.exports = (env, argv) => {
|
|
|
|
const PATHS = {
|
|
src: path.join(__dirname, 'src')
|
|
}
|
|
|
|
const config = {
|
|
entry: {
|
|
main: './src/index.js'
|
|
},
|
|
output: {
|
|
path: path.join(__dirname, 'dist'),
|
|
publicPath: '/',
|
|
filename: '[name].js',
|
|
globalObject: 'this'
|
|
},
|
|
target: 'web',
|
|
devtool: 'source-map',
|
|
resolve: {
|
|
extensions: ['.js', '.jsx'],
|
|
},
|
|
performance: {
|
|
hints: false
|
|
},
|
|
module: {
|
|
rules: [
|
|
{
|
|
test: /\.css$/,
|
|
use: [
|
|
MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader',
|
|
]
|
|
},
|
|
{
|
|
enforce: 'pre',
|
|
test: /\.js$/,
|
|
use: ['source-map-loader'],
|
|
},
|
|
{
|
|
test: /\.js$/,
|
|
exclude: /node_modules/,
|
|
loader: 'babel-loader'
|
|
},
|
|
{
|
|
test: /\.html$/,
|
|
use: [
|
|
{
|
|
loader: 'html-loader',
|
|
options: {
|
|
interpolate: true,
|
|
minimize: false
|
|
}
|
|
}
|
|
]
|
|
},
|
|
{
|
|
test: /\.(woff|woff2|eot|ttf|otf|png|svg|jpg|gif)$/,
|
|
use: ['file-loader']
|
|
}
|
|
]
|
|
},
|
|
plugins: [
|
|
new MiniCssExtractPlugin({
|
|
filename: 'style.css',
|
|
chunkFilename: 'style.css',
|
|
ignoreOrder: false
|
|
}),
|
|
new PurgecssPlugin({
|
|
paths: glob.sync(`${PATHS.src}/**/*`, { nodir: true }),
|
|
}),
|
|
new HtmlWebPackPlugin({
|
|
template: './src/index.html',
|
|
filename: './index.html'
|
|
}),
|
|
new FaviconsWebpackPlugin('./src/img/icon.png'),
|
|
new webpack.NoEmitOnErrorsPlugin(),
|
|
new webpack.WatchIgnorePlugin(['./dist'])
|
|
]
|
|
}
|
|
|
|
if (argv.mode == 'development') {
|
|
config.devtool = 'inline-source-map'
|
|
|
|
config.devServer = {
|
|
watchContentBase: true,
|
|
historyApiFallback: true,
|
|
hot: true,
|
|
inline: true,
|
|
|
|
host: '0.0.0.0',
|
|
port: 3000
|
|
}
|
|
|
|
config.plugins.push(new webpack.HotModuleReplacementPlugin())
|
|
config.plugins.push(new OpenBrowserPlugin({
|
|
url: 'http://localhost:3000'
|
|
}))
|
|
}
|
|
|
|
if (argv.mode == 'production') {
|
|
config.optimization = {
|
|
minimizer: [
|
|
new TerserPlugin({
|
|
cache: true,
|
|
parallel: true,
|
|
sourceMap: true
|
|
}),
|
|
new OptimizeCSSAssetsPlugin({})
|
|
]
|
|
}
|
|
}
|
|
|
|
return config
|
|
}
|