nextConfig.webpack() — react Function Reference

Architecture documentation for the nextConfig.webpack() function in next.config.js from the react codebase.

Function javascript BabelCompiler Entrypoint

Entity Profile

BabelCompiler→ Entrypoint→ nextConfig.webpack() — react Function Reference

Dependency Diagram

graph TD
  e1b6c834_6462_2f51_f258_3f0d7a5818d6["nextConfig.webpack()"]
  9fa8acce_e082_c535_1322_c04ef20be621["next.config.js"]
  e1b6c834_6462_2f51_f258_3f0d7a5818d6 -->|defined in| 9fa8acce_e082_c535_1322_c04ef20be621
  style e1b6c834_6462_2f51_f258_3f0d7a5818d6 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

compiler/apps/playground/next.config.js lines 17–48

  webpack: (config, options) => {
    // Load *.d.ts files as strings using https://webpack.js.org/guides/asset-modules/#source-assets.
    config.module.rules.push({
      test: /\.d\.ts/,
      type: 'asset/source',
    });

    // Monaco Editor
    if (!options.isServer) {
      config.plugins.push(
        new MonacoWebpackPlugin({
          languages: ['typescript', 'javascript'],
          filename: 'static/[name].worker.js',
        })
      );
    }

    config.resolve.alias = {
      ...config.resolve.alias,
      'react-compiler-runtime': path.resolve(
        __dirname,
        '../../packages/react-compiler-runtime'
      ),
    };
    config.resolve.fallback = {
      fs: false,
      path: false,
      os: false,
    };

    return config;
  },