reactjs - React/Next.js推荐的后端API URL等常量设置方式

Question

我正在查看 next.js 文档，并试图了解建议的方法是什么来设置在不同环境中更改的 URL。大多数情况下，我想确保我在开发和生产中正确指向后端 URL。

我想您可以创建一个常量配置文件，但是是否有受支持的最佳实践？

Answer 1

打开 next.config.js 并使用您的常量添加 publicRuntimeConfig 配置:

module.exports = {
  publicRuntimeConfig: {
// Will be available on both server and client
yourKey: 'your-value'
},
}

你可以像这样从另一个 .js 文件中调用它

import getConfig from 'next/config'
const { publicRuntimeConfig } = getConfig()
console.log(publicRuntimeConfig.yourKey)

甚至可以像这样从 View 中调用它

${publicRuntimeConfig.yourKey}