How to ignore entire folder in Next.js method in application?

Question

In the next 13 days, the app/api folder will generate an error during the build process when nextConfig.output is "export".

In my project, I need different build types based on environment variables.

Is there any way to ignore the "api" folder during the build process when "output" is "export"?

When I run the build using nextConfig.output as "export" I get the following error:

The export encountered an error on the following path: /api/revalidate/route: /api/revalidate

src/app/api/revalidate/route.ts file

import { NextRequest, NextResponse } from 'next/server';
import { revalidateTag } from 'next/cache';
 
export async function GET(request: NextRequest) {
  const tag = request.nextUrl.searchParams.get('tag');
  if(tag){
    revalidateTag(tag);
  }
  return NextResponse.json({ revalidated: true, now: Date.now() });
}

Next.config.js

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: process.env.NEXT_OUTPUT_MODE,
};

module.exports = nextConfig;

Copyable Repository

Here is the repository that reproduces this error https://github.com/zeckaissue/next-export-api-crash

Answer 1

You can use the ignore option in the Next.js configuration file (next.config.js). You must create a configuration file if you have not already done so. Open the next.config.js file and add the following code:

module.exports = {
  webpack: (config, { isServer }) => {
    if (!isServer) {
      config.module.rules.push({
        test: /YOUR FOLDER NAME\/.*/,
        loader: 'ignore-loader',
      });
}

Answer 2

I found the solution to ignore-loader. But maybe there is a better way to achieve my goal through next.js's built-in functionality

This is my updated next.config.js

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: process.env.NEXT_OUTPUT_MODE,
  /**
   *
   * @param {import('webpack').Configuration} config
   * @param {import('next/dist/server/config-shared').WebpackConfigContext} context
   * @returns {import('webpack').Configuration}
   */
  webpack: (config) => {
    if (process.env.NEXT_OUTPUT_MODE !== "export" || !config.module) {
      return config;
    }
    config.module.rules?.push({
      test: /src\/app\/api/,
      loader: "ignore-loader",
    });
    return config;
  },
};

module.exports = nextConfig;