我正在尝试设置我的nextjs应用程序以使用运行时配置。基本上,我有一个端点url需要通过docker env vars可用。
我按照这些文档进行了配置,但它并没有起作用。我的应用程序仍然使用.env文件中的默认值。是否有人能帮助我理解我错过了什么或做错了什么?
谢谢!
docs: https://nextjs.org/docs/api-reference/next.config.js/runtime-configuration https://nextjs.org/docs/advanced-features/custom-app
步骤: 1- 添加到我的next.config.js文件中publicRuntimeConfig: {
NEXT_PUBLIC_BACKEND_HOST: process.env.NEXT_PUBLIC_BACKEND_HOST,
},
2- 在我的页面中检索配置
const { publicRuntimeConfig } = getConfig()
const baseURL = publicRuntimeConfig.NEXT_PUBLIC_BACKEND_HOST
3- 创建了一个自定义应用程序来设置getInitialProps
如果没有getInitialProps,运行时配置将对任何页面(或页面中的组件)不可用。
import App from 'next/app'
function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />
}
MyApp.getInitialProps = async (appContext) => {
const appProps = await App.getInitialProps(appContext);
return { ...appProps }
}
export default MyApp
NEXT_PUBLIC_
并不是问题所在。对我来说一切都正常工作,所以我认为你在运行next start
时可能没有设置NEXT_PUBLIC_BACKEND_HOST
环境变量。请查看更新后的答案。 - FINDarkside