next#NextConfig TypeScript Examples

The following examples show how to use next#NextConfig. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.

Example #1

Source File: withLodash.ts From nextclade with MIT License

6 votes

withLodash = (options: Options) => (nextConfig: NextConfig) => {
  return addWebpackPlugin(
    nextConfig,
    new LodashWebpackPlugin({
      caching: true,
      chaining: true,
      cloning: true,
      coercions: true,
      collections: true,
      currying: true,
      deburring: true,
      exotics: true,
      flattening: true,
      guards: true,
      memoizing: true,
      metadata: true,
      paths: true,
      placeholders: true,
      shorthands: true,
      unicode: true,
      ...options,
    }),
  )
}

Example #2

Source File: index.ts From telefunc with MIT License

6 votes

function telefuncPlugin(nextConfig: NextConfig = {}) {
  return Object.assign({}, nextConfig, {
    webpack: (config, options) => {
      install(config)
      if (typeof nextConfig.webpack === 'function') {
        return nextConfig.webpack(config, options)
      }
      return config
    }
  } as NextConfig)
}

Example #3

Source File: withoutMinification.ts From nextclade with MIT License

6 votes

export default function withoutMinification(nextConfig: NextConfig) {
  return addWebpackConfig(nextConfig, (nextConfig, webpackConfig) => {
    if (webpackConfig.optimization) {
      webpackConfig.optimization.minimizer = []
    } else {
      webpackConfig.optimization = { minimizer: [] }
    }
    return webpackConfig
  })
}

Example #4

Source File: withoutDebugPackage.ts From nextclade with MIT License

6 votes

export default function withoutDebugPackage(nextConfig: NextConfig) {
  return addWebpackLoader(nextConfig, (_webpackConfig, _context) => ({
    test: /\.(ts|tsx|js|jsx)$/i,
    use: [
      {
        loader: path.resolve(__dirname, 'loaders', 'removeDebugPackageLoader.js'),
      },
    ],
  }))
}

Example #5

Source File: withSvg.ts From nextclade with MIT License

6 votes

export default function withSvg(nextConfig: NextConfig) {
  return addWebpackLoader(nextConfig, (_webpackConfig, _context) => ({
    test: /\.svg$/i,
    issuer: /\.(ts|tsx|js|jsx|md|mdx|scss|sass|css)$/,
    use: [
      {
        loader: '@svgr/webpack',
        options: {
          removeViewbox: false,
          typescript: false,
        },
      },
    ],
  }))
}

Example #6

Source File: withRobotsTxt.ts From nextclade with MIT License

6 votes

getWithRobotsTxt = (content: string) => (nextConfig: NextConfig) => {
  return addWebpackPlugin(
    nextConfig,
    new EmitFilePlugin({
      path: '.',
      filename: 'robots.txt',
      content,
      hash: false,
    }),
  )
}

Example #7

Source File: withResolve.ts From nextclade with MIT License

6 votes

export default function withResolve(nextConfig: NextConfig) {
  return addWebpackConfig(nextConfig, (nextConfig, webpackConfig) => {
    webpackConfig.resolve = {
      ...webpackConfig.resolve,
      modules: [
        ...(webpackConfig.resolve?.modules ?? []),
        path.resolve(moduleRoot),
        path.resolve(moduleRoot, '..'),
        path.resolve(moduleRoot, 'src'),
        path.resolve(moduleRoot, 'node_modules'),
      ],
    }

    return webpackConfig
  })
}

Example #8

Source File: withIgnore.ts From nextclade with MIT License

6 votes

export default function withIgnore(nextConfig: NextConfig) {
  return addWebpackPlugin(
    nextConfig,
    new webpack.IgnorePlugin({
      checkResource: (resource: string) => {
        return (
          resource.endsWith('awesomplete.css') ||
          resource.includes('core-js/library') ||
          resource.includes('babel-runtime')
        )
      },
    }),
  )
}

Example #9

Source File: withFriendlyConsole.ts From nextclade with MIT License

6 votes

getWithFriendlyConsole =
  ({ clearConsole, projectRoot, packageName, progressBarColor }: WithFriendlyConsoleParams) =>
  (nextConfig: NextConfig) => {
    const cfg = addWebpackPlugin(
      nextConfig,
      new FriendlyErrorsWebpackPlugin({
        clearConsole,
        additionalTransformers: [cleanup(), stripProjectRoot(projectRoot)],
        additionalFormatters: [],
      }),
    )

    return addWebpackPlugin(cfg, new WebpackBar({ name: packageName, color: progressBarColor }))
  }

Example #10

Source File: withFriendlyChunkNames.ts From nextclade with MIT License

6 votes

export default function withFriendlyChunkNames(nextConfig: NextConfig) {
  return addWebpackConfig(nextConfig, (nextConfig, webpackConfig, _options) => {
    if (
      typeof webpackConfig.optimization?.splitChunks !== 'boolean' &&
      webpackConfig.optimization?.splitChunks?.cacheGroups
    ) {
      unset(webpackConfig, 'optimization.splitChunks.cacheGroups.lib.name')
      unset(webpackConfig, 'optimization.splitChunks.cacheGroups.shared.name')
    }
    return webpackConfig
  })
}

Example #11

Source File: next.config.ts From nextclade with MIT License

6 votes

nextConfig: NextConfig = {
  distDir: `.build/${process.env.NODE_ENV}/tmp`,
  pageExtensions: ['js', 'jsx', 'ts', 'tsx', 'md', 'mdx', 'all-contributorsrc'],
  onDemandEntries: {
    maxInactiveAge: 60 * 1000,
    pagesBufferLength: 2,
  },
  modern: false,
  reactStrictMode: false,
  reactRoot: true,
  experimental: {
    reactRoot: true,
    scrollRestoration: true,
  },
  swcMinify: true,
  productionBrowserSourceMaps: ENABLE_SOURCE_MAPS,
  excludeDefaultMomentLocales: true,
  devIndicators: {
    buildActivity: false,
  },
  typescript: {
    ignoreBuildErrors: true,
  },
  eslint: {
    ignoreDuringBuilds: true,
  },
  compiler: {
    styledComponents: true,
  },
  env: clientEnv,
  poweredByHeader: false,
}

Example #12

Source File: addWebpackPlugin.ts From nextclade with MIT License

6 votes

export function addWebpackPlugin(
  nextConfig: NextConfig,
  plugin: WebpackPluginInstance | WebpackPluginFunction | ((this: Compiler, compiler: Compiler) => void) | any,
) {
  return addWebpackConfig(
    nextConfig,
    (nextConfig: NextConfig, webpackConfig: Configuration, { isServer }: WebpackConfigContext) => {
      if (!isServer) {
        if (webpackConfig?.plugins) {
          webpackConfig.plugins.push(plugin)
        } else {
          return { plugins: [plugin] }
        }
      }
      return webpackConfig
    },
  )
}

Example #13

Source File: addWebpackConfig.ts From nextclade with MIT License

6 votes

export function addWebpackConfig(nextConfig: NextConfig, customWebpackConfig: CustomWebpackConfig) {
  const webpack = (webpackConfig: Configuration, options: WebpackConfigContext) => {
    const newConfig = customWebpackConfig(nextConfig, webpackConfig, options)

    if (typeof nextConfig.webpack === 'function') {
      return nextConfig.webpack(newConfig, options)
    }

    return newConfig
  }

  return { ...nextConfig, webpack }
}

Example #14

Source File: withExtraWatch.ts From nextclade with MIT License

5 votes

getWithExtraWatch =
  ({ files, dirs }: WithExtraWatchOptions) =>
  (nextConfig: NextConfig) => {
    return addWebpackPlugin(nextConfig, new ExtraWatchWebpackPlugin({ files, dirs }))
  }

Example #15

Source File: index.tsx From next-plausible with MIT License

5 votes

export function withPlausibleProxy(options: NextPlausibleProxyOptions = {}) {
  return (nextConfig: NextConfig): NextConfig => {
    const nextPlausiblePublicProxyOptions: NextPlausiblePublicProxyOptions = {
      ...options,
      trailingSlash: !!nextConfig.trailingSlash,
    }
    return {
      ...nextConfig,
      publicRuntimeConfig: {
        ...nextConfig.publicRuntimeConfig,
        nextPlausiblePublicProxyOptions,
      },
      rewrites: async () => {
        const domain = getDomain(options)
        const getRemoteScript = (...modifiers: (ScriptModifier | null)[]) =>
          domain +
          getScriptPath(
            {
              scriptName: getRemoteScriptName(
                domain,
                domain !== plausibleDomain
              ),
            },
            ...modifiers
          )
        const plausibleRewrites = [
          {
            source: getScriptPath(options),
            destination: getRemoteScript(),
          },
          ...getCombinations(allModifiers).map((modifiers) => ({
            source: getScriptPath(options, ...modifiers),
            destination: getRemoteScript(...modifiers),
          })),
          {
            source: getApiEndpoint(nextPlausiblePublicProxyOptions),
            destination: `${domain}/api/event`,
          },
        ]

        if (process.env.NEXT_PLAUSIBLE_DEBUG) {
          console.log('plausibleRewrites = ', plausibleRewrites)
        }

        const rewrites = await nextConfig.rewrites?.()

        if (!rewrites) {
          return plausibleRewrites
        } else if (Array.isArray(rewrites)) {
          return rewrites.concat(plausibleRewrites)
        } else {
          rewrites.afterFiles = rewrites.afterFiles.concat(plausibleRewrites)
          return rewrites
        }
      },
    }
  }
}

Example #16

Source File: withRaw.ts From nextclade with MIT License

5 votes

export default function withRaw(nextConfig: NextConfig) {
  return addWebpackLoader(nextConfig, (_webpackConfig, _context) => ({
    test: /\.(txt|fasta|gff|csv|tsv)$/i,
    type: 'asset/source',
  }))
}

Example #17

Source File: withCopy.ts From nextclade with MIT License

5 votes

getWithCopy = (options: CopyPluginOptions) => (nextConfig: NextConfig) => {
  return addWebpackPlugin(nextConfig, new CopyPlugin(options))
}

Example #18

Source File: withTypeChecking.ts From nextclade with MIT License

5 votes

getWithTypeChecking =
  ({ eslint, typeChecking, memoryLimit = 512, exclude }: GetWithTypeCheckingParams) =>
  (nextConfig: NextConfig) => {
    if (!typeChecking && !eslint) {
      return nextConfig
    }

    return addWebpackPlugin(
      nextConfig,
      new ForkTsCheckerWebpackPlugin({
        issue: {
          exclude: exclude?.map((file) => ({ origin: 'typescript', file })),
        },

        typescript: {
          enabled: typeChecking,
          configFile: path.join(moduleRoot, 'tsconfig.json'),
          memoryLimit,
          mode: 'write-references',
          diagnosticOptions: { syntactic: true, semantic: true, declaration: true, global: true },
          configOverwrite: {
            compilerOptions: {
              ...tsConfig.compilerOptions,
              skipLibCheck: true,
              sourceMap: false,
              inlineSourceMap: false,
              declarationMap: false,
            },
            include: [
              'lib/**/*.js',
              'lib/**/*.jsx',
              'lib/**/*.ts',
              'lib/**/*.tsx',
              'src/**/*.js',
              'src/**/*.jsx',
              'src/**/*.ts',
              'src/**/*.tsx',
            ],
            exclude: [...tsConfig.exclude, ...(exclude ?? [])],
          },
        },

        eslint: {
          enabled: eslint,
          memoryLimit,
          files: [path.join(moduleRoot, 'src/**/*.{js,jsx,ts,tsx}')],
          options: { cache: false },
        },

        formatter: 'codeframe',
      }),
    )
  }

Example #19

Source File: withUrlAsset.ts From nextclade with MIT License

5 votes

export default function withUrlAsset(nextConfig: NextConfig) {
  return addWebpackLoader(nextConfig, (_webpackConfig, _context) => ({
    type: 'asset',
    resourceQuery: /url/, // *.svg?url
  }))
}

Example #20

Source File: withWasm.ts From nextclade with MIT License

5 votes

export default function withWasm(nextConfig: NextConfig) {
  return addWebpackConfig(nextConfig, (nextConfig, webpackConfig) => {
    set(webpackConfig, 'experiments.asyncWebAssembly', true)
    return webpackConfig
  })
}

Example #21

Source File: withWebpackWatchPoll.ts From nextclade with MIT License

5 votes

export default function withWebpackWatchPoll(nextConfig: NextConfig) {
  return addWebpackConfig(nextConfig, (nextConfig, webpackConfig) => {
    set(webpackConfig, 'watchOptions.poll', 1000)
    return webpackConfig
  })
}

Example #22

Source File: addWebpackLoader.ts From nextclade with MIT License

5 votes

export function addWebpackLoader(nextConfig: NextConfig, getLoader: GetLoaderFunction) {
  return addWebpackConfig(nextConfig, (nextConfig, webpackConfig, options) => {
    const loader = getLoader(webpackConfig, options)
    webpackConfig?.module?.rules?.push(loader)
    return webpackConfig
  })
}

Example #23

Source File: index.ts From next-rpc with MIT License

5 votes

export default function init(withRpcConfig: WithRpcConfig = {}) {
  return (nextConfig: NextConfig = {}): NextConfig => {
    return {
      ...nextConfig,

      webpack(config: webpack.Configuration, options) {
        const { experimentalContext = false } = withRpcConfig;
        const { isServer, dev, dir } = options;
        const pagesDir = findPagesDir(dir);
        const apiDir = path.resolve(pagesDir, './api');

        const rpcPluginOptions: RpcPluginOptions = {
          isServer,
          pagesDir,
          dev,
          apiDir,
          basePath: nextConfig.basePath || '/',
        };

        const contextPluginOptions: ContextPluginOptions = { apiDir, isServer };

        config.module = config.module || {};
        config.module.rules = config.module.rules || [];
        config.module.rules.push({
          test: /\.(tsx|ts|js|mjs|jsx)$/,
          include: [pagesDir],
          use: [
            options.defaultLoaders.babel,
            {
              loader: 'babel-loader',
              options: {
                sourceMaps: dev,
                plugins: [
                  [
                    require.resolve('../dist/babelTransformRpc'),
                    rpcPluginOptions,
                  ],
                  ...(experimentalContext
                    ? [
                        [
                          require.resolve('../dist/babelTransformContext'),
                          contextPluginOptions,
                        ],
                      ]
                    : []),
                  require.resolve('@babel/plugin-syntax-jsx'),
                  [
                    require.resolve('@babel/plugin-syntax-typescript'),
                    { isTSX: true },
                  ],
                ],
              },
            },
          ],
        });

        if (typeof nextConfig.webpack === 'function') {
          return nextConfig.webpack(config, options);
        } else {
          return config;
        }
      },
    };
  };
}