fix: prevent mutating runtime config in runtime code (#3630)

Author: BobbieGoede

specs/fixtures/different_domains/server/plugins/issue-3400.ts

@@ -0,0 +1,11 @@
+import { defineNitroPlugin, useRuntimeConfig } from 'nitropack/runtime'
+
+// This runtime config usage combined with `differentDomains` originally triggered #3400
+export default defineNitroPlugin(nitroApp => {
+  const runtimeConfig = useRuntimeConfig()
+
+  nitroApp.hooks.hook('request', event => {
+    event.context.nitro = event.context.nitro ?? {}
+    event.context.nitro.runtimeConfig = runtimeConfig
+  })
+})

src/runtime/context.ts

@@ -31,6 +31,8 @@ export type NuxtI18nContext = {
   /** SSG with dynamic locale resources */
   dynamicResourcesSSG: boolean
   getVueI18n: () => I18n
+  /** Get default locale */
+  getDefaultLocale: () => string
   /** Load locale messages */
   loadLocaleMessages: (locale: Locale) => Promise<void>
   /** Get current locale */
@@ -64,7 +66,7 @@ function createI18nCookie({ cookieCrossOrigin, cookieDomain, cookieSecure, cooki
   })
 }
 
-export function createNuxtI18nContext(nuxt: NuxtApp, _i18n: I18n): NuxtI18nContext {
+export function createNuxtI18nContext(nuxt: NuxtApp, _i18n: I18n, defaultLocale: string): NuxtI18nContext {
   const i18n = getI18nTarget(_i18n)
   const serverLocaleConfigs = useLocaleConfigs()
   const runtimeI18n = nuxt.$config.public.i18n as I18nPublicRuntimeConfig
@@ -82,6 +84,7 @@ export function createNuxtI18nContext(nuxt: NuxtApp, _i18n: I18n): NuxtI18nConte
     preloaded: false,
     dynamicResourcesSSG,
     getVueI18n: () => _i18n,
+    getDefaultLocale: () => defaultLocale,
     getLocale: () => unref(i18n.locale),
     setLocale: (locale: string) => {
       if (isRef(i18n.locale)) {

src/runtime/domain.ts

@@ -119,8 +119,7 @@ export function setupMultiDomainLocales(defaultLocale: string, router: Router =
 /**
  * Returns default locale for the current domain, returns `defaultLocale` by default
  */
-export function getDefaultLocaleForDomain(runtimeI18n: I18nPublicRuntimeConfig) {
-  const { defaultLocale } = runtimeI18n
+export function getDefaultLocaleForDomain(defaultLocale: string) {
   const host = getHost()
   if (normalizedLocales.some(l => l.defaultForDomains != null)) {
     return normalizedLocales.find(l => !!l.defaultForDomains?.includes(host))?.code ?? ''

src/runtime/plugins/i18n.ts

@@ -25,19 +25,12 @@ export default defineNuxtPlugin({
 
     const nuxt = useNuxtApp()
     const runtimeI18n = nuxt.$config.public.i18n as I18nPublicRuntimeConfig
-
-    let defaultLocaleDomain: string = runtimeI18n.defaultLocale || ''
+    const defaultLocale: string = getDefaultLocaleForDomain(runtimeI18n.defaultLocale || '')
     if (__MULTI_DOMAIN_LOCALES__) {
-      defaultLocaleDomain = getDefaultLocaleForDomain(runtimeI18n)
-      setupMultiDomainLocales(defaultLocaleDomain)
+      setupMultiDomainLocales(defaultLocale)
     }
 
-    runtimeI18n.defaultLocale = defaultLocaleDomain
-
-    const vueI18nOptions: I18nOptions = await setupVueI18nOptions()
-    if (defaultLocaleDomain) {
-      vueI18nOptions.locale = defaultLocaleDomain
-    }
+    const vueI18nOptions: I18nOptions = await setupVueI18nOptions(defaultLocale)
 
     if (import.meta.server) {
       const serverLocaleConfigs = useLocaleConfigs()
@@ -53,7 +46,7 @@ export default defineNuxtPlugin({
     // create i18n instance
     const i18n = createI18n(vueI18nOptions)
 
-    nuxt._nuxtI18nCtx = createNuxtI18nContext(nuxt, i18n)
+    nuxt._nuxtI18nCtx = createNuxtI18nContext(nuxt, i18n, defaultLocale)
     const ctx = useNuxtI18nContext(nuxt)
 
     nuxt._nuxtI18n = createComposableContext(runtimeI18n)
@@ -97,7 +90,7 @@ export default defineNuxtPlugin({
         composer.loadLocaleMessages = ctx.loadLocaleMessages
 
         composer.differentDomains = __DIFFERENT_DOMAINS__
-        composer.defaultLocale = runtimeI18n.defaultLocale
+        composer.defaultLocale = defaultLocale
 
         composer.getBrowserLocale = ctx.getBrowserLocale
         composer.getLocaleCookie = ctx.getLocaleCookie

src/runtime/server/plugin.ts

@@ -1,6 +1,6 @@
 import { stringify } from 'devalue'
 import { defineI18nMiddleware } from '@intlify/h3'
-import { defineNitroPlugin } from 'nitropack/runtime'
+import { defineNitroPlugin, useRuntimeConfig } from 'nitropack/runtime'
 import { tryUseI18nContext, createI18nContext } from './context'
 import { createUserLocaleDetector } from './utils/locale-detector'
 import { pickNested } from './utils/messages-utils'
@@ -12,9 +12,13 @@ import { localeDetector } from '#internal/i18n/locale.detector.mjs'
 
 import type { H3Event } from 'h3'
 import type { CoreOptions } from '@intlify/core'
+import type { I18nPublicRuntimeConfig } from '~/src/types'
 
 export default defineNitroPlugin(async nitro => {
-  const options = await setupVueI18nOptions()
+  const runtime18n = useRuntimeConfig().public.i18n as I18nPublicRuntimeConfig
+  const defaultLocale: string = runtime18n.defaultLocale || ''
+
+  const options = await setupVueI18nOptions(defaultLocale)
   const localeConfigs = createLocaleConfigs(options.fallbackLocale)
 
   nitro.hooks.hook('request', async (event: H3Event) => {
@@ -63,7 +67,7 @@ export default defineNitroPlugin(async nitro => {
 
   // enable server-side translations and user locale-detector
   if (localeDetector != null) {
-    const options = await setupVueI18nOptions()
+    const options = await setupVueI18nOptions(defaultLocale)
     const i18nMiddleware = defineI18nMiddleware({
       ...(options as CoreOptions),
       locale: createUserLocaleDetector(options.locale, options.fallbackLocale)

src/runtime/shared/vue-i18n.ts

@@ -1,18 +1,15 @@
-import { useRuntimeConfig } from '#app'
 import { loadVueI18nOptions } from './messages'
 import { vueI18nConfigs, localeCodes as _localeCodes } from '#build/i18n.options.mjs'
 
 import type { I18nOptions } from 'vue-i18n'
-import type { I18nPublicRuntimeConfig } from '#internal-i18n-types'
 
 type ResolvedI18nOptions = Omit<I18nOptions, 'messages' | 'locale' | 'fallbackLocale'> &
   Required<Pick<I18nOptions, 'messages' | 'locale' | 'fallbackLocale'>>
 
-export const setupVueI18nOptions = async (): Promise<ResolvedI18nOptions> => {
-  const runtimeI18n = useRuntimeConfig().public.i18n as unknown as I18nPublicRuntimeConfig
+export const setupVueI18nOptions = async (defaultLocale: string): Promise<ResolvedI18nOptions> => {
   const options = await loadVueI18nOptions(vueI18nConfigs)
 
-  options.locale = runtimeI18n.defaultLocale || options.locale || 'en-US'
+  options.locale = defaultLocale || options.locale || 'en-US'
   options.fallbackLocale ??= false
   options.messages ??= {}
 

src/runtime/utils.ts

@@ -66,9 +66,9 @@ export function useComposableContext(): ComposableContext {
 export function createComposableContext(runtimeI18n: I18nPublicRuntimeConfig): ComposableContext {
   const router = useRouter()
   const ctx = useNuxtI18nContext()
-
+  const defaultLocale = ctx.getDefaultLocale()
   const routeByPathResolver = createLocalizedRouteByPathResolver(router)
-  const getLocalizedRouteName = createLocaleRouteNameGetter(runtimeI18n.defaultLocale)
+  const getLocalizedRouteName = createLocaleRouteNameGetter(defaultLocale)
 
   function getRouteBaseName(route: RouteRecordNameGeneric | RouteLocationGenericPath | null) {
     return _getRouteBaseName(route, __ROUTE_NAME_SEPARATOR__)
@@ -95,7 +95,7 @@ export function createComposableContext(runtimeI18n: I18nPublicRuntimeConfig): C
       return route
     }
 
-    if (!__DIFFERENT_DOMAINS__ && prefixable(locale, runtimeI18n.defaultLocale)) {
+    if (!__DIFFERENT_DOMAINS__ && prefixable(locale, defaultLocale)) {
       route.path = '/' + locale + route.path
     }
 
@@ -106,7 +106,7 @@ export function createComposableContext(runtimeI18n: I18nPublicRuntimeConfig): C
   return {
     router,
     getRoutingOptions: () => ({
-      defaultLocale: runtimeI18n.defaultLocale,
+      defaultLocale: defaultLocale,
       strictCanonicals: runtimeI18n.experimental.alternateLinkCanonicalQueries ?? true,
       hreflangLinks: !(!__I18N_ROUTING__ && !__DIFFERENT_DOMAINS__)
     }),