skip to Main Content

I have a Next.js app that I’ve been building with AWS codebuild for several years without issue.

I recently updated the project to Next.js 14 (from 13) and am now getting failed builds with the following error:

unhandledRejection ReferenceError: Headers is not defined
    at Object.<anonymous> (/codebuild/output/src3629032198/src/node_modules/next/dist/server/web/spec-extension/adapters/headers.js:32:30)
    at Module._compile (node:internal/modules/cjs/loader:1198:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1252:10)
    at Module.load (node:internal/modules/cjs/loader:1076:32)
    at Function.Module._load (node:internal/modules/cjs/loader:911:12)
    at Module.require (node:internal/modules/cjs/loader:1100:19)
    at Module.mod.require (/codebuild/output/src3629032198/src/node_modules/next/dist/server/require-hook.js:64:28)
    at require (node:internal/modules/cjs/helpers:119:18)
    at Object.<anonymous> (/codebuild/output/src3629032198/src/node_modules/next/dist/server/api-utils/index.js:63:18)
    at Module._compile (node:internal/modules/cjs/loader:1198:14)

This appears to be an error in the Next.js codebase itself.

My own code makes no reference to "Headers" anywhere.

Has anyone else had this issue, and can anyone suggest any solutions?

Possibly useful info

My package.json NPM build script is:

"build": "NEXT_PUBLIC_VERSION=$npm_package_version NEXT_PUBLIC_DATE=$(date +%s) next build",

My buildspec.yml file is:

version: 0.2
phases:
  pre_build:
    commands:
      - npm install
  build:
    commands:
      - npm run build
artifacts:
  files:
    - '**/*'
  base-directory: build

And my next.config.js is:

const isLocal = process.env.NODE_ENV === 'development';

const nextConfig = {
  trailingSlash: true,

  // Build settings
  output: 'export',
  distDir: 'build',

  // Handle SVG imports
  webpack(config) {
    config.module.rules.push({
      test: /.svg$/i,
      issuer: /.[jt]sx?$/,
      use: '@svgr/webpack',
    });
    return config;
  },

  // SCSS options
  sassOptions: {
    logger: {
      warn: function (message) {
        console.warn(message);
      },
      debug: function (message) {
        console.log(message);
      },
    },
  },

  // Define whether to remove console.log statements from the deployed code
  compiler: {
    removeConsole: isLocal ? false : true,
  },
};

module.exports = nextConfig;

Note:

When successfully using Next.js 13, my build script included "&& next export -o build" on the end:

"build": "NEXT_PUBLIC_VERSION=$npm_package_version NEXT_PUBLIC_DATE=$(date +%s) next build && next export -o build",

But upgrade guides told me to move this to next.config.js instead:

output: 'export',
distDir: 'build',

2

Answers


  1. NextJs 14 requires node >=18.17, which is not available in the standard Amazon Linux 2 build image. You’ll need to configure build settings to use the Amazon Linux 2023 build image, and override the NodeJs version to >= 18.17. That’s how I got mine working.

    Login or Signup to reply.
  2. as seen in:
    https://aws.amazon.com/de/blogs/mobile/6-new-aws-amplify-launches-to-make-frontend-development-easier/

    Amplify Hosting now has Next.js 14 support as well. To use this new feature, set amplify:al2023 as the value for the custom build image if this is the app’s first deployment. Conversely, if the app has already been deployed, then select the Amazon Linux: 2023 image from the dropdown.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search