Конфигурация времени выполнения (runtime)
Узнайте, как перенести конфигурацию времени выполнения (runtime) с Nuxt 2 на Nuxt 3.
Чтобы использовать переменные окружения внутри приложения Nuxt 3, задайте их через конфигурацию времени выполнения.
При обращении к этим переменным из компонентов используйте композабл useRuntimeConfig в хуке setup (или в плагине Nuxt).
В части приложения server/ useRuntimeConfig доступен без импортов.
Миграция
- Добавьте любые переменные окружения, которые вы используете в своём приложении, в свойство
runtimeConfigфайлаnuxt.config. - Замените
process.envнаuseRuntimeConfigво всех Vue-частях вашего приложения.
export default defineNuxtConfig({
runtimeConfig: {
// Конфигурация для приватного использования, доступная только на сервере
apiSecret: '123',
// Конфигурация внутри public будет также доступна клиенту
public: {
apiBase: '/api',
},
},
})
<script setup lang="ts">
const config = useRuntimeConfig()
// вместо process.env теперь будет использоваться config.public.apiBase
console.log(config.public.apiBase)
</script>
export default defineEventHandler((event) => {
const config = useRuntimeConfig(event)
// На стороне сервера можно получить доступ к config.apiSecret, в дополнение к config.public
console.log(config.apiSecret)
console.log(config.public.apiBase)
})
# Значения runtime-конфигурации подставляются из одноимённых переменных окружения
NUXT_API_SECRET=api_secret_token
NUXT_PUBLIC_API_BASE=https://nuxtjs.org