Function createDevBrowserConfig

lib/webpack/shared.cjs:184–242

(baseConfig, babelConfig, envVars)

}

async function createDevBrowserConfig(baseConfig, babelConfig, envVars) {
  const browserConfig = createBaseBrowserConfig(baseConfig);
  const babelRule = getBrowserBabelRule(babelConfig);
  const { alchemyKey, walletConnectKey, neynarKey } = await getConfigs();
  return {
    ...browserConfig,
    mode: 'development',
    plugins: [
      ...browserConfig.plugins,
      new webpack.DefinePlugin({
        'process.env': {
          NODE_ENV: JSON.stringify('development'),
          BROWSER: true,
          COMM_ALCHEMY_KEY: JSON.stringify(alchemyKey),
          COMM_WALLETCONNECT_KEY: JSON.stringify(walletConnectKey),
          COMM_NEYNAR_KEY: JSON.stringify(neynarKey),
          ...envVars,
        },
      }),
      new ReactRefreshWebpackPlugin(),
    ],
    module: {
      rules: [
        {
          ...babelRule,
          options: {
            ...babelRule.options,
            plugins: [
              require.resolve('react-refresh/babel'),
              ...babelRule.options.plugins,
            ],
          },
        },
        imageRule,
        typographyRule,
        {
          test: /\.css$/,
          exclude: /node_modules\/.*\.css$/,
          use: [styleLoader, cssLoader],
        },
        {
          test: /node_modules\/.*\.css$/,
          sideEffects: true,
          use: [
            styleLoader,
            {
              ...cssLoader,
              options: {
                ...cssLoader.options,
                modules: false,
              },
            },
          ],
        },
      ],
    },
    devtool: 'eval-cheap-module-source-map',
  };