next.config.js Options
Next.js は、プロジェクトディレクトリの root (例えば、package.json
によって)にあるnext.config.js
ファイルを通じて設定できます。これは、 default export によるものです。
// @ts-check
/** @type {import('next').NextConfig} */
const nextConfig = {
/* config options here */
}
module.exports = nextConfig
next.config.js
は通常の Node.js モジュールであり、JSON ファイルではありません。これは Next.js server と build フェーズによって使用され、ブラウザの build には含まれていません。
もしあなたがECMAScript modules が必要な場合、next.config.mjs
を使用することができます:
// @ts-check
/**
* @type {import('next').NextConfig}
*/
const nextConfig = {
/* config options here */
}
export default nextConfig
あなたはまた、関数を使用することもできます:
// @ts-check
export default (phase, { defaultConfig }) => {
/**
* @type {import('next').NextConfig}
*/
const nextConfig = {
/* config options here */
}
return nextConfig
}
Next.js12.1.0 以降、あなたは async 関数を使うことができます。
// @ts-check
module.exports = async (phase, { defaultConfig }) => {
/**
* @type {import('next').NextConfig}
*/
const nextConfig = {
/* config options here */
}
return nextConfig
}
phase
は、設定がロードされる現在の context です。利用可能なフェーズ を見ることができます。フェーズはnext/constants
からインポートすることができます。
// @ts-check
const { PHASE_DEVELOPMENT_SERVER } = require("next/constants");
module.exports = (phase, { defaultConfig }) => {
if (phase === PHASE_DEVELOPMENT_SERVER) {
return {
/* development only config options here */
};
}
return {
/* config options for all phases except development here */
};
};
コメントされた行は、next.config.js
で許可されている設定を置くことができる場所であり、それらはこのファイルで定義されています 。
ただし、config はいずれも必須ではなく、各々の config が何をするのかを理解する必要はありません。代わりに、このセクションで有効にしたり、修正したりする必要のある機能を探し、それらが何をするべきかを示します。
あなたの target Node.js version で利用できない新しい JavaScript の特徴を使用するのは避けてください。
next.config.js
は Webpack、Babel、または TypeScript によって解析されません。
このページは、利用可能なすべての設定の options を文書化しています: