138 lines
3.3 KiB
JavaScript
138 lines
3.3 KiB
JavaScript
'use strict';
|
|
|
|
const path = require('path');
|
|
const webpack = require('webpack');
|
|
const { rules, plugins } = require('./webpack.common');
|
|
const TerserPlugin = require('terser-webpack-plugin');
|
|
const CopyPlugin = require('copy-webpack-plugin');
|
|
const CleanPlugin = require('clean-webpack-plugin');
|
|
const isDev = process.env.NODE_ENV !== 'production';
|
|
|
|
const resolveDir = dir => path.resolve(__dirname, dir);
|
|
const HTMLPlugin = require('html-webpack-plugin');
|
|
const html = new HTMLPlugin({
|
|
title: 'yacd - Yet Another Clash Dashboard',
|
|
template: 'src/index.template.ejs',
|
|
inject: false,
|
|
filename: 'index.html'
|
|
});
|
|
|
|
const svgSpriteRule = {
|
|
test: /\.svg$/,
|
|
use: ['svg-sprite-loader']
|
|
};
|
|
|
|
// ---- entry
|
|
|
|
const entry = {
|
|
app: ['whatwg-fetch', './src/app.js']
|
|
};
|
|
|
|
// ---- output
|
|
|
|
const output = {
|
|
path: path.resolve(__dirname, 'public'),
|
|
// use contenthash instead of chunkhash to take advantage of caching
|
|
filename: isDev ? '[name].bundle.js' : '[name].[contenthash].js',
|
|
publicPath: ''
|
|
};
|
|
|
|
// const vendor = ['redux', 'react', 'react-dom', 'react-router-dom'];
|
|
|
|
// if (!isDev) entry.vendor = vendor; // generate common vendor bundle in prod
|
|
|
|
// if (isDev) {
|
|
// const dllRefPlugin = new webpack.DllReferencePlugin({
|
|
// context: '.',
|
|
// manifest: require('./public/vendor-manifest.json')
|
|
// });
|
|
// plugins.push(dllRefPlugin);
|
|
// }
|
|
|
|
// since we don't use dll plugin for now - we still get vendor's bundled in a separate bundle
|
|
// entry.vendor = vendor;
|
|
// entry.react = react;
|
|
|
|
const mode = isDev ? 'development' : 'production';
|
|
|
|
const definePlugin = new webpack.DefinePlugin({
|
|
__DEV__: JSON.stringify(isDev),
|
|
'process.env': {
|
|
NODE_ENV: JSON.stringify(process.env.NODE_ENV)
|
|
}
|
|
});
|
|
|
|
plugins.push(html);
|
|
plugins.push(definePlugin);
|
|
plugins.push(new CopyPlugin([{ from: 'assets/*', flatten: true }]));
|
|
|
|
if (!isDev) {
|
|
plugins.push(new CleanPlugin());
|
|
}
|
|
|
|
let devtool;
|
|
if (isDev) {
|
|
devtool = 'eval-source-map';
|
|
} else {
|
|
// devtool = 'source-map';
|
|
devtool = false;
|
|
}
|
|
|
|
module.exports = {
|
|
devtool,
|
|
entry,
|
|
output,
|
|
mode,
|
|
resolve: {
|
|
alias: {
|
|
a: resolveDir('src/api'),
|
|
s: resolveDir('src/svg'),
|
|
m: resolveDir('src/misc'),
|
|
d: resolveDir('src/ducks'),
|
|
c: resolveDir('src/components')
|
|
}
|
|
},
|
|
module: {
|
|
rules: [
|
|
svgSpriteRule,
|
|
rules.js,
|
|
rules.file,
|
|
rules.css,
|
|
rules.cssModules,
|
|
rules.sass,
|
|
rules.sassCssModules
|
|
]
|
|
},
|
|
optimization: {
|
|
splitChunks: {
|
|
chunks: 'all',
|
|
// see https://gist.github.com/sokra/1522d586b8e5c0f5072d7565c2bee693#optimizationruntimechunk
|
|
cacheGroups: {
|
|
// corejs: {
|
|
// test: /[\\/]node_modules[\\/](core-js)[\\/]/,
|
|
// chunks: 'all'
|
|
// },
|
|
// chartjs: {
|
|
// test: /[\\/]node_modules[\\/]chart\.js[\\/]/,
|
|
// // name: 'chartjs',
|
|
// chunks: 'all'
|
|
// },
|
|
react: {
|
|
test: /[\\/]node_modules[\\/](react-dom|react|redux|react-router|react-router-dom|schedule|react-redux|react-modal)[\\/]/,
|
|
chunks: 'all'
|
|
}
|
|
}
|
|
},
|
|
runtimeChunk: true,
|
|
minimizer: [
|
|
// the current uglifyjs-webpack-plugin has problems workin with React Hooks
|
|
// see also:
|
|
// https://github.com/webpack-contrib/uglifyjs-webpack-plugin/issues/374
|
|
new TerserPlugin({
|
|
cache: true,
|
|
parallel: true
|
|
})
|
|
]
|
|
},
|
|
plugins
|
|
};
|