assetPrefix

注意：部署到 Vercel 會自動為您的 Next.js 專案設定全域 CDN。您不需要手動設定 Asset Prefix。

小知識：Next.js 9.5+ 新增了對可自訂 Base Path 的支援，這更適合將您的應用程式託管在類似 /docs 的子路徑上。我們不建議您針對此用例使用自訂 Asset Prefix。

設定 CDN

若要設定 CDN，您可以設定 asset prefix 並設定 CDN 的來源以解析到 Next.js 託管的網域。

開啟 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 chunk 的請求

#4b9b41aaa062cbbfeff4add70f256968c51ece5d.4d708494b3aed70c04f0.js

將會變成

https://cdn.mydomain.com#4b9b41aaa062cbbfeff4add70f256968c51ece5d.4d708494b3aed70c04f0.js

將檔案上傳到給定 CDN 的確切設定將取決於您選擇的 CDN。您需要在 CDN 上託管的唯一資料夾是 .next/static/ 的內容，應以 _next/static/ 的形式上傳，如上述 URL 請求所示。請勿上傳 .next/ 資料夾的其餘部分，因為您不應將伺服器程式碼和其他設定暴露給公眾。

雖然 assetPrefix 涵蓋對 _next/static 的請求，但它不會影響以下路徑

public 資料夾中的檔案；如果您想透過 CDN 提供這些資源，您必須自行引入前綴