const { resolve } = require('path');
const webpack = require('webpack');
const merge = require('webpack-merge');
const HtmlWebPackPlugin = require('html-webpack-plugin');
const autoprefixer = require('autoprefixer');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const TerserPlugin = require('terser-webpack-plugin');
const CompressionWebpackPlugin = require('compression-webpack-plugin');
const common = require('./webpack.common');
const { getThemeConfig, getCustomStyleVariables } = require('./utils');
const theme = getThemeConfig();
const root = (path) => resolve(__dirname, `../${path}`);
const { version, ...restConfig } = common;
const outputPath = 'skyline_console/static';
module.exports = (env) => {
const API = (env || {}).API || 'mock';
return merge(restConfig, {
entry: {
main: root('src/core/index.jsx'),
},
output: {
filename: '[name].js',
path: root(outputPath),
publicPath: '/',
chunkFilename: `[name].bundle.${version}.js`,
},
mode: 'production',
module: {
rules: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
use: ['babel-loader'],
},
{
test: /\.css$/,
use: [
{
loader: 'style-loader',
},
{
loader: 'css-loader',
},
],
},
{
test: /\.(css|less)$/,
exclude: /node_modules/,
use: [
{
loader: 'style-loader',
},
{
loader: 'css-loader',
options: {
modules: {
mode: 'global',
},
localIdentName: '[name]__[local]--[hash:base64:5]',
},
},
{
loader: 'postcss-loader',
options: {
plugins: [autoprefixer('last 2 version')],
sourceMap: false,
},
},
{
loader: 'less-loader',
options: {
importLoaders: true,
javascriptEnabled: true,
},
},
{
loader: resolve('config/less-replace-loader'),
options: {
variableFile: getCustomStyleVariables(),
},
},
],
},
{
test: /\.(less)$/,
include: /node_modules/,
use: [
{
loader: 'style-loader',
},
{
loader: 'css-loader',
},
{
loader: 'less-loader',
options: {
javascriptEnabled: true,
modifyVars: theme,
},
},
],
},
],
},
plugins: [
new webpack.DefinePlugin({
'process.env.API': JSON.stringify(API),
}),
new HtmlWebPackPlugin({
template: root('src/asset/template/index.html'),
favicon: root('src/asset/image/favicon.ico'),
}),
new CleanWebpackPlugin([outputPath], {
root: resolve(__dirname, `../`),
}),
new CompressionWebpackPlugin({
algorithm: 'gzip',
test: /\.js$/,
threshold: 10240,
minRatio: 0.8,
}),
],
optimization: {
splitChunks: {
maxInitialRequests: 10,
cacheGroups: {
commons: {
chunks: 'async',
name: 'common',
minChunks: 2,
minSize: 0,
},
vendor: {
test: /node_modules/,
chunks: 'async',
name: 'vendor',
priority: 10,
enforce: true,
},
},
},
runtimeChunk: {
name: () => `runtime.${version}`,
},
minimize: true,
minimizer: [
new TerserPlugin({
extractComments: false,
sourceMap: false,
terserOptions: {
compress: {
drop_console: true,
},
},
}),
],
},
});
};