Work app Next.js config

next.config.js

// omit imports and stuff

// Using Next 11.1

module.exports = withPlugins(
  [
    withBundleAnalyzer({
      enabled: process.env.ANALYZE === 'true'
    })
  ],
  {
    // Expose EMR app config values to all server-side Next code
    serverRuntimeConfig: config,
    // Generate sourcemaps for prod builds
    productionBrowserSourceMaps: true,
    // Use Webpack 5 instead of WP4
    webpack5: true,
    eslint: {
      // Don't run additional ESLint checks during builds - we do that ourselves
      ignoreDuringBuilds: true
    },
    webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack }) => {
      const resolvedBaseUrl = path.resolve(config.context, '..');
      // This extra config allows to use paths defined in tsconfig
      // @link https://github.com/vercel/next.js/pull/13542
      Object.assign(config.resolve.alias, hq.get('webpack'));

      config.module.rules = [
        ...config.module.rules,
        {
          test: /\.(tsx|ts|js|mjs|jsx)$/,
          include: [resolvedBaseUrl],
          use: defaultLoaders.babel,
          exclude: excludePath => {
            return /node_modules/.test(excludePath);
          }
        }
      ];

      config.plugins.push(
        new CircularDependencyPlugin({
          failOnError: true,
          exclude: /node_modules|graphQL/i,
          cwd: process.cwd()
        })
      );

      return config;
    }
  }
);