algorithmx-demo/webpack.config.ts at master · algrx/algorithmx-demo · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
import * as path from 'path';
import * as webpack from 'webpack';
import MergeIntoSingleFilePlugin from 'webpack-merge-and-include-globally';
import webpackMerge from 'webpack-merge';
import HtmlPlugin from 'html-webpack-plugin';
import MiniCssExtractPlugin from 'mini-css-extract-plugin';

const outputPath = path.resolve(__dirname, 'dist');
const brythonVersion = require('./brython/version.json').version;

const commonConfig: webpack.Configuration = {
    entry: {
        index: ['./src/index.tsx'],
    },
    output: {
        path: outputPath,
        filename: '[name].[contenthash:8].js',
    },
    module: {
        rules: [
            {
                test: /\.(ts|tsx)$/,
                use: 'ts-loader',
                exclude: /node_modules/,
            },
            {
                test: /\.s?css$/,
                use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
            },
            {
                test: /\.(png|svg|jpg|gif)$/,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            name: 'images/[name].[ext]',
                        },
                    },
                ],
                exclude: /node_modules/,
            },
            {
                test: /examples.*\.(py|js)$/,
                use: [{ loader: 'raw-loader' }],
                exclude: /node_modules/,
            },
            {
                test: /brython.*\.js$/,
                use: [{ loader: 'raw-loader' }],
                exclude: /node_modules/,
            },
        ],
    },
    resolve: {
        extensions: ['.tsx', '.ts', '.js'],
    },
    optimization: {
        splitChunks: {
            cacheGroups: {
                commons: {
                    test: /[\\/]node_modules[\\/]/,
                    name: 'vendors',
                    chunks: 'all',
                },
            },
        },
    },
    plugins: [
        new webpack.ProgressPlugin({}),
        new MiniCssExtractPlugin({
            filename: '[name].[contenthash:8].css',
        }) as webpack.WebpackPluginInstance,
        new HtmlPlugin({
            filename: 'index.html',
            template: './src/index.html',
            inject: true,
            excludeChunks: ['brython_modules'],
        }),
    ],
};

const brythonConfig: webpack.Configuration = {
    entry: {},
    output: {
        path: outputPath,
    },
    plugins: [
        new MergeIntoSingleFilePlugin({
            files: {
                [`brython.${brythonVersion}.js`]: [
                    './brython/dist/brython.js',
                    './brython/dist/brython_modules.js',
                ],
            },
        }) as webpack.WebpackPluginInstance,
    ],
    performance: {
        maxEntrypointSize: 3500 * 1000,
        maxAssetSize: 3500 * 1000,
    },
};

const prodConfig: webpack.Configuration = {
    mode: 'production',
    devtool: 'source-map',
    plugins: [
        new webpack.DefinePlugin({
            'process.env.NODE_ENV': "'production'",
        }),
    ],
};

const devConfig: webpack.Configuration = {
    mode: 'development',
    devtool: 'inline-source-map',
    devServer: {
        contentBase: outputPath,
        compress: true,
        hot: false,
        port: 9000,
    },
    plugins: [new webpack.HotModuleReplacementPlugin()],
};

module.exports = (env: {}, argv: webpack.Configuration) => {
    const config = argv.mode === 'production' ? prodConfig : devConfig;
    return [brythonConfig, webpackMerge(commonConfig, config)];
};