要将环境变量添加到 JavaScript 打包文件中,请打开 next.config.js
并添加 env
配置:
js
module.exports = {
env: {
customKey: 'my-value',
},
}
现在,您可以在代码中访问 process.env.customKey
。例如:
jsx
function Page() {
return <h1>customKey 的值是:{process.env.customKey}</h1>
}
export default Page
Next.js 将在构建时将 process.env.customKey
替换为 'my-value'
。由于 webpack DefinePlugin 的特性,尝试解构 process.env
变量将无法工作。
例如,以下代码行:
jsx
return <h1>customKey 的值是:{process.env.customKey}</h1>
最终将变成:
jsx
return <h1>customKey 的值是:{'my-value'}</h1>