For custom advanced configuration of Next.js, you can create a
next.config.mjs file in the root of your project directory (next to
next.config.js is a regular Node.js module, not a JSON file. It gets used by the Next.js server and build phases, and it's not included in the browser build.
Take a look at the following
If you need ECMAScript modules, you can use
You can also use a function:
Since Next.js 12.1.0, you can use an async function:
phase is the current context in which the configuration is loaded. You can see the available phases. Phases can be imported from
The commented lines are the place where you can put the configs allowed by
next.config.js, which are defined in this file.
However, none of the configs are required, and it's not necessary to understand what each config does. Instead, search for the features you need to enable or modify in this section and they will show you what to do.
next.config.jswill not be parsed by Webpack, Babel or TypeScript.