env

自 Next.js 9.4 版本發布後，我們現在提供了更直觀且符合人體工學的新增環境變數體驗。立即試用！

重要提示：以此方式指定的環境變數將始終包含在 JavaScript 套件中，只有在透過環境或 .env 檔案指定時，為環境變數名稱加上 NEXT_PUBLIC_ 前綴才會生效。

若要將環境變數加入 JavaScript 套件，請開啟 next.config.js 並新增 env 設定：

module.exports = {
  env: {
    customKey: 'my-value',
  },
}

現在您可以在程式碼中存取 process.env.customKey。例如：

function Page() {
  return <h1>customKey 的值為: {process.env.customKey}</h1>
}

export default Page

Next.js 會在建置階段將 process.env.customKey 替換為 'my-value'。由於 webpack DefinePlugin 的特性，嘗試解構 process.env 變數將無法運作。

例如，以下程式碼：

return <h1>The value of customKey is: {process.env.customKey}</h1>

最終會被轉換為：

return <h1>The value of customKey is: {'my-value'}</h1>