assetPrefix

注意：Vercelにデプロイすると、あなたのNext.jsプロジェクトに自動的にグローバルCDNが設定されます； Asset Prefixを手動で設定する必要はありません。

Good to know：Next.js 9.5+では、カスタマイズ可能なBase Pathのサポートが追加され、/docsのようなサブパスでアプリケーションをホスティングするのに適しています；このユースケースでは、カスタムAsset Prefixを使用することをお勧めしません。

CDNの設定

CDNを設定するには、asset prefixを設定し、Next.jsがホストされているドメインにCDNのオリジンを解決するように設定します；

next.config.mjsを開き、フェーズに基づいてassetPrefix設定を追加します：

next.config.mjs
// @ts-check
import { PHASE_DEVELOPMENT_SERVER } from 'next/constants'

export default (phase) => {
  const isDev = phase === PHASE_DEVELOPMENT_SERVER
  /**
   * @type {import('next').NextConfig}
   */
  const nextConfig = {
    assetPrefix: isDev ? undefined : 'https://cdn.mydomain.com',
  }
  return nextConfig
}

Next.jsは、自動的に/_next/パス（.next/static/フォルダー）からロードするJavaScriptとCSSファイルに対して、あなたのasset prefixを使用します；例えば、上記の設定を使用すると、JSチャンクのリクエストは次のようになります：

/_next/static/chunks/4b9b41aaa062cbbfeff4add70f256968c51ece5d.4d708494b3aed70c04f0.js

これは代わりに次のようになります：

https://cdn.mydomain.com/_next/static/chunks/4b9b41aaa062cbbfeff4add70f256968c51ece5d.4d708494b3aed70c04f0.js

指定したCDNにファイルをアップロードするための具体的な設定は、選択するCDNに依存します；CDNにホストする必要がある唯一のフォルダーは、.next/static/の内容であり、上記のURLリクエストが示すように_next/static/としてアップロードする必要があります。.next/フォルダーの残りをアップロードしないでください；あなたのサーバーコードや他の設定を公開するべきではありません。

assetPrefixは、_next/staticへのリクエストをカバーしますが、次のパスには影響しません：

publicフォルダー内のファイル；これらのアセットをCDN経由で提供したい場合は、自分でプレフィックスを導入する必要があります

CDNの設定​

CDNの設定