/ packages / DApp / webpack.config.cjs
webpack.config.cjs
  1  /* eslint-disable @typescript-eslint/no-var-requires */
  2  
  3  const path = require('path')
  4  const HtmlWebpackPlugin = require('html-webpack-plugin')
  5  const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin')
  6  const webpack = require('webpack')
  7  
  8  module.exports = () => {
  9    const environment = process.env.ENV ?? 'development'
 10  
 11    if (!['development', 'preview', 'production'].includes(environment)) {
 12      throw new Error('Unsupported environment')
 13    }
 14  
 15    return {
 16      entry: './src/main.tsx',
 17      output: {
 18        filename: 'index.[fullhash].js',
 19        path: path.join(__dirname, 'dist'),
 20        publicPath: '/',
 21        clean: true,
 22      },
 23      devtool: 'source-map',
 24      resolve: {
 25        extensions: ['.ts', '.tsx', '.js', '.json'],
 26        fallback: {
 27          buffer: require.resolve('buffer/'),
 28          crypto: require.resolve('crypto-browserify'),
 29          stream: require.resolve('stream-browserify'),
 30          assert: require.resolve('assert'),
 31          process: require.resolve('process/browser.js'),
 32          zlib: false,
 33          fs: false,
 34          path: false,
 35        },
 36      },
 37      externals: {
 38        'protobufjs-cli': 'commonjs protobufjs-cli',
 39      },
 40      module: {
 41        rules: [
 42          {
 43            test: /\.m?[jt]sx?$/,
 44            resolve: {
 45              fullySpecified: false,
 46            },
 47            use: {
 48              loader: 'babel-loader',
 49              options: {
 50                cacheDirectory: true,
 51                babelrc: false,
 52                presets: [
 53                  '@babel/preset-typescript',
 54                  [
 55                    '@babel/preset-env',
 56                    {
 57                      useBuiltIns: 'entry',
 58                      targets: { browsers: 'chrome 77' },
 59                      corejs: { version: '3.26' },
 60                    },
 61                  ],
 62                  '@babel/preset-react',
 63                ],
 64                plugins: ['babel-plugin-styled-components'],
 65              },
 66            },
 67          },
 68          {
 69            enforce: 'pre',
 70            test: /\.js$/,
 71            exclude: /node_modules/,
 72            loader: 'source-map-loader',
 73          },
 74          {
 75            test: /\.(png|svg|jpg|gif|woff|woff2|eot|ttf|otf|ico)$/,
 76            use: ['file-loader'],
 77          },
 78        ],
 79      },
 80      plugins: [
 81        new ForkTsCheckerWebpackPlugin(),
 82        new HtmlWebpackPlugin({
 83          template: 'index.html',
 84        }),
 85        new webpack.DefinePlugin({
 86          'process.env.ENV': JSON.stringify(environment),
 87          'process.env.VOTING_CONTRACT': JSON.stringify(process.env.VOTING_CONTRACT),
 88          'process.env.DIRECTORY_CONTRACT': JSON.stringify(process.env.DIRECTORY_CONTRACT),
 89          'process.env.MULTICALL_CONTRACT': JSON.stringify(process.env.MULTICALL_CONTRACT),
 90          'process.env.TOKEN_CONTRACT': JSON.stringify(process.env.TOKEN_CONTRACT),
 91          'process.env.FEATURED_VOTING_CONTRACT': JSON.stringify(process.env.FEATURED_VOTING_CONTRACT),
 92          'process.env.INFURA_API_KEY': JSON.stringify(process.env.INFURA_API_KEY),
 93        }),
 94        new webpack.ProvidePlugin({
 95          process: 'process/browser.js',
 96          Buffer: ['buffer', 'Buffer'],
 97        }),
 98      ],
 99      devServer: {
100        historyApiFallback: true,
101        host: '0.0.0.0',
102        hot: true,
103        server: 'https',
104        client: {
105          overlay: true,
106        },
107      },
108      snapshot: {
109        managedPaths: [path.resolve(__dirname, 'node_modules')],
110        immutablePaths: [],
111      },
112      stats: 'minimal',
113    }
114  }