Ignoring a folder when building the nextjs app

Question

When building the nextjs app I want to ignore everything under the externals folder.

I have added this but my 'npm run build' still fails. I want to ignore everything under the 'externals' folder which is located in the root folder of the project.

next.config.js

/** @type {import('next').NextConfig} */
const nextConfig = { 
  output: 'standalone',
  webpack: (config) => {
    config.module.rules.push({
      test: /.*externals.*/, // I also tried /externals\/.*/ and /externals/
      loader: "ignore-loader",
    });

    return config;
  },
};
module.exports = nextConfig;

Error when creating the build

$ npm run build

[...]
Failed to compile.

./externals/helpers.ts:59:29
Type error: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
  Type 'undefined' is not assignable to type 'string'.

Answer 1

The issue probably isn't webpack but typescript that tries to check the file while you have type errors. Exclude the file or the entire directory in your tsconfig.json. That would be done like this:

// your tsconfig.json file
{
  "compilerOptions": {
    // ... your compiler options
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "src/**/*.spec.ts", "src/example-nested"]
}