运行时配置
了解如何将 Nuxt 2 的运行时配置迁移到 Nuxt 3。
Maschinelle Übersetzung ·0 % geprüft
如果你希望在 Nuxt 3 应用中引用环境变量，你需要使用运行时配置（runtime config）。
在组件中引用这些变量时，你需要在 setup 方法（或 Nuxt 插件）中使用 useRuntimeConfig 组合式函数。
在应用的 server/ 部分中，你可以无需导入即可使用 useRuntimeConfig。
迁移
- 将应用中使用的所有环境变量添加到
nuxt.config文件的runtimeConfig属性中。 - 将应用的 Vue 部分中的
process.env迁移为useRuntimeConfig。
export default defineNuxtConfig({
runtimeConfig: {
// Private Konfiguration, die nur auf dem Server verfügbar ist
apiSecret: '123',
// Konfiguration innerhalb von public wird ebenfalls dem Client zur Verfügung gestellt
public: {
apiBase: '/api',
},
},
})<script setup lang="ts">
const config = useRuntimeConfig()
// Anstelle von process.env greifst du jetzt auf config.public.apiBase zu
console.log(config.public.apiBase)
</script>export default defineEventhandler((event) => {
const config = useRuntimeConfig(event)
// Auf dem Server kannst du jetzt zusätzlich zu config.public auch auf config.apiSecret zugreifen
console.log(config.apiSecret)
console.log(config.public.apiBase)
})# Werte der Laufzeitkonfiguration werden zur Laufzeit automatisch durch passende Umgebungsvariablen ersetzt
NUXT_API_SECRET=api_secret_token
NUXT_PUBLIC_API_BASE=https://nuxtjs.org