XSound.app/webpack.config.mjs at main · Korilakkuma/XSound.app · 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
import MiniCSSExtractPlugin from 'mini-css-extract-plugin';
import CssMinimizerPlugin from 'css-minimizer-webpack-plugin';
import TerserPlugin from 'terser-webpack-plugin';
import path from 'node:path';

const dirname = path.resolve('.');

const terserPlugin = new TerserPlugin({
  terserOptions: {
    compress: {
      drop_console: true
    },
    keep_classnames: /^.*?Processor$/
  }
});

export default [
  {
    mode: 'development',
    entry: {
      app: ['./src/main.tsx', './src/main.css']
    },
    output: {
      globalObject: 'this',
      filename: '[name].js',
      path: `${dirname}/assets`,
      publicPath: '/assets/',
      assetModuleFilename: 'images/[name][ext]'
    },
    module: {
      rules: [
        {
          test: /\.(ts|tsx)$/,
          exclude: /node_modules/,
          use: [
            {
              loader: 'ts-loader',
              options: {
                transpileOnly: true
              }
            }
          ]
        },
        {
          test: /\.css$/,
          use: [MiniCSSExtractPlugin.loader, 'css-loader']
        },
        {
          test: /\.png$/,
          type: 'asset/resource'
        }
      ]
    },
    resolve: {
      extensions: ['.js', '.ts', '.tsx', '.json']
    },
    plugins: [
      new MiniCSSExtractPlugin({
        filename: 'app.css'
      })
    ],
    optimization: {
      // eslint-disable-next-line no-undef
      minimize: process.env.NODE_ENV === 'production',
      minimizer: [terserPlugin, new CssMinimizerPlugin()],
      splitChunks: {
        chunks: 'all',
        name: 'vendor'
      },
      usedExports: true
    },
    devtool: 'source-map',
    devServer: {
      static: dirname,
      host: '0.0.0.0'
    }
  },
  {
    mode: 'development',
    entry: {
      register: ['./src/register-service-worker.ts'],
      sw: ['./src/service-worker.ts']
    },
    output: {
      globalObject: 'this',
      filename: '[name].js',
      path: dirname,
      publicPath: '/'
    },
    module: {
      rules: [
        {
          test: /\.ts$/,
          exclude: /node_modules/,
          use: [
            {
              loader: 'ts-loader',
              options: {
                transpileOnly: true
              }
            }
          ]
        }
      ]
    },
    resolve: {
      extensions: ['.js', '.ts']
    },
    optimization: {
      // eslint-disable-next-line no-undef
      minimize: process.env.NODE_ENV === 'production',
      minimizer: [terserPlugin],
      usedExports: true
    }
  }
];