fix: webpack and rspack virtual file resolution (#3385)

Author: BobbieGoede

build.config.ts

@@ -2,5 +2,13 @@ import { defineBuildConfig } from 'unbuild'
 
 export default defineBuildConfig({
   entries: ['src/module'],
-  externals: ['node:fs', 'node:url', 'webpack', '@babel/parser', 'unplugin-vue-router', 'unplugin-vue-router/options']
+  externals: [
+    'node:fs',
+    'node:url',
+    'webpack',
+    '@rspack/core',
+    '@babel/parser',
+    'unplugin-vue-router',
+    'unplugin-vue-router/options'
+  ]
 })

internals.d.ts

@@ -62,7 +62,7 @@ declare module '#internal/i18n/locale.detector.mjs' {
   export const localeDetector: LocaleDetector
 }
 
-declare module 'virtual:nuxt-i18n-logger' {
+declare module '#nuxt-i18n/logger' {
   import type { ConsolaInstance } from 'consola'
 
   export function createLogger(label: string): ConsolaInstance

package.json

@@ -102,7 +102,7 @@
     "@intlify/unplugin-vue-i18n": "^6.0.3",
     "@intlify/utils": "^0.13.0",
     "@miyaneee/rollup-plugin-json5": "^1.2.0",
-    "@nuxt/kit": "^3.15.4",
+    "@nuxt/kit": "^3.16.0",
     "@oxc-parser/wasm": "^0.53.0",
     "@rollup/plugin-yaml": "^4.1.2",
     "@vue/compiler-sfc": "^3.5.13",
@@ -118,7 +118,7 @@
     "scule": "^1.1.1",
     "std-env": "^3.8.0",
     "ufo": "^1.3.1",
-    "unplugin": "^1.10.1",
+    "unplugin": "^2.2.0",
     "unplugin-vue-router": "^0.10.8",
     "vue-i18n": "^10.0.5",
     "vue-router": "^4.5.0"
@@ -127,7 +127,8 @@
     "@babel/types": "^7.24.7",
     "@eslint/js": "9.5.0",
     "@nuxt/module-builder": "^0.8.4",
-    "@nuxt/schema": "^3.15.4",
+    "@nuxt/schema": "^3.16.0",
+    "@rspack/core": "^1.2.6",
     "@types/debug": "^4.1.9",
     "@types/eslint": "^8.56.6",
     "@unhead/vue": "^1.8.8",
@@ -146,7 +147,7 @@
     "lint-staged": "^15.2.7",
     "nitropack": "^2.9.7",
     "npm-run-all2": "^6.2.0",
-    "nuxt": "^3.15.4",
+    "nuxt": "^3.16.0",
     "ofetch": "^1.3.4",
     "playwright-core": "^1.45.3",
     "prettier": "^3.3.2",

pnpm-lock.yaml

@@ -1,8 +1,10 @@
 // @ts-ignore
+import createJITI from 'jiti'
 import { JSDOM } from 'jsdom'
 import { expect } from 'vitest'
 import { getBrowser, startServer, url, useTestContext } from './utils'
 import { snakeCase } from 'scule'
+import { resolveAlias } from '@nuxt/kit'
 
 import { errors, type BrowserContextOptions, type Page } from 'playwright-core'
 
@@ -208,9 +210,11 @@ export async function startServerWithRuntimeConfig(env: Record<string, unknown>)
 
 export async function localeLoaderHelpers() {
   const ctx = useTestContext()
-  const opts = await import(ctx.nuxt?.options.buildDir + '/i18n.options.mjs')
+  const jiti = createJITI(ctx.nuxt!.options.rootDir, { alias: ctx.nuxt!.options.alias })
+  const opts = await jiti.import(resolveAlias('#build/i18n.options.mjs'), {})
 
   function findKey(code: string, ext: string, cache: boolean = false): string {
+    // @ts-expect-error generated
     return opts.localeLoaders[code].find(x => x.cache === cache && x.key.includes(ext + '_'))!.key
   }
 

specs/fixtures/empty_options/tsconfig.json

@@ -1,13 +1,13 @@
 /* eslint-disable @typescript-eslint/no-floating-promises */
 import createDebug from 'debug'
 import { resolve } from 'pathe'
-import { extendViteConfig, addWebpackPlugin, addBuildPlugin } from '@nuxt/kit'
+import { extendViteConfig, addWebpackPlugin, addBuildPlugin, addTemplate, addRspackPlugin } from '@nuxt/kit'
 import VueI18nPlugin from '@intlify/unplugin-vue-i18n'
 import { toArray } from './utils'
 import { TransformMacroPlugin } from './transform/macros'
 import { ResourcePlugin } from './transform/resource'
-import { i18nVirtualLoggerPlugin } from './virtual-logger'
 import { TransformI18nFunctionPlugin } from './transform/i18n-function-injection'
+import { asI18nVirtual } from './transform/utils'
 import { getLayerLangPaths } from './layers'
 
 import type { Nuxt } from '@nuxt/schema'
@@ -31,20 +31,38 @@ export async function extendBundler(ctx: I18nNuxtContext, nuxt: Nuxt) {
     sourcemap: !!nuxt.options.sourcemap.server || !!nuxt.options.sourcemap.client
   }
 
+  addTemplate({
+    write: true,
+    filename: 'nuxt-i18n-logger.mjs',
+    getContents() {
+      if (!ctx.options.debug) {
+        return `export function createLogger() {}`
+      }
+
+      return `
+import { createConsola } from 'consola'
+
+const debugLogger = createConsola({ level: ${ctx.options.debug === 'verbose' ? 999 : 4} }).withTag('i18n')
+
+export function createLogger(label) {
+  return debugLogger.withTag(label)
+}`
+    }
+  })
+
+  nuxt.options.alias[asI18nVirtual('logger')] = ctx.resolver.resolve(nuxt.options.buildDir, './nuxt-i18n-logger.mjs')
+
   /**
    * shared plugins (nuxt/nitro)
    */
-  const loggerPlugin = i18nVirtualLoggerPlugin(ctx.options.debug)
   const resourcePlugin = ResourcePlugin(sourceMapOptions, ctx)
 
-  addBuildPlugin(loggerPlugin)
   addBuildPlugin(resourcePlugin)
 
   nuxt.hook('nitro:config', async cfg => {
     cfg.rollupConfig!.plugins = (await cfg.rollupConfig!.plugins) || []
     cfg.rollupConfig!.plugins = toArray(cfg.rollupConfig!.plugins)
 
-    cfg.rollupConfig!.plugins.push(loggerPlugin.rollup())
     cfg.rollupConfig!.plugins.push(resourcePlugin.rollup())
   })
 
@@ -90,6 +108,22 @@ export async function extendBundler(ctx: I18nNuxtContext, nuxt: Nuxt) {
     debug((e as Error).message)
   }
 
+  /**
+   * rspack plugin
+   */
+  try {
+    const { rspack } = await import('@rspack/core')
+
+    addRspackPlugin(
+      new rspack.DefinePlugin({
+        ...getFeatureFlags(nuxtOptions.bundle),
+        __DEBUG__: String(!!nuxtOptions.debug)
+      })
+    )
+  } catch (e: unknown) {
+    debug((e as Error).message)
+  }
+
   /**
    * vite plugin
    */

specs/helper.ts

@@ -89,7 +89,7 @@ export const NUXT_I18N_COMPOSABLE_DEFINE_ROUTE = 'defineI18nRoute'
 export const NUXT_I18N_COMPOSABLE_DEFINE_LOCALE = 'defineI18nLocale'
 export const NUXT_I18N_COMPOSABLE_DEFINE_CONFIG = 'defineI18nConfig'
 export const NUXT_I18N_COMPOSABLE_DEFINE_LOCALE_DETECTOR = 'defineI18nLocaleDetector'
-export const NUXT_I18N_VIRTUAL_PREFIX = 'virtual:nuxt-i18n'
+export const NUXT_I18N_VIRTUAL_PREFIX = '#nuxt-i18n'
 
 export const TS_EXTENSIONS = ['.ts', '.cts', '.mts']
 export const JS_EXTENSIONS = ['.js', '.cjs', '.mjs']

src/bundler.ts

@@ -14,7 +14,7 @@ import {
 import { NUXT_I18N_MODULE_ID, DEFAULT_COOKIE_KEY, isSSG, localeCodes, normalizedLocales } from '#build/i18n.options.mjs'
 import { findBrowserLocale, getLocalesRegex, getRouteName } from './routing/utils'
 import { initCommonComposableOptions, type CommonComposableOptions } from './utils'
-import { createLogger } from 'virtual:nuxt-i18n-logger'
+import { createLogger } from '#nuxt-i18n/logger'
 
 import type { Locale } from 'vue-i18n'
 import type { DetectBrowserLanguageOptions, LocaleObject } from '#internal-i18n-types'

src/constants.ts

@@ -1,5 +1,5 @@
 import { deepCopy, isFunction } from '@intlify/shared'
-import { createLogger } from 'virtual:nuxt-i18n-logger'
+import { createLogger } from '#nuxt-i18n/logger'
 
 import type { I18nOptions, Locale, FallbackLocale, LocaleMessages, DefineLocaleMessage } from 'vue-i18n'
 import type { NuxtApp } from '#app'

src/runtime/internal.ts

@@ -25,7 +25,7 @@ import {
 } from '../internal'
 import { createLocaleFromRouteGetter, resolveBaseUrl } from '../routing/utils'
 import { extendI18n } from '../routing/i18n'
-import { createLogger } from 'virtual:nuxt-i18n-logger'
+import { createLogger } from '#nuxt-i18n/logger'
 import { getI18nTarget } from '../compatibility'
 import { resolveRoute } from '../routing/routing'
 import { localeHead } from '../routing/head'

src/runtime/messages.ts

@@ -1,7 +1,7 @@
 import { unref } from 'vue'
 import { hasPages } from '#build/i18n.options.mjs'
 import { addRouteMiddleware, defineNuxtPlugin, defineNuxtRouteMiddleware } from '#imports'
-import { createLogger } from 'virtual:nuxt-i18n-logger'
+import { createLogger } from '#nuxt-i18n/logger'
 import { makeFallbackLocaleCodes } from '../messages'
 import { createLocaleFromRouteGetter } from '../routing/utils'
 import { detectLocale, detectRedirect, loadAndSetLocale, navigate } from '../utils'

src/runtime/plugins/i18n.ts

@@ -1,7 +1,7 @@
 import { unref } from 'vue'
 import { isSSG } from '#build/i18n.options.mjs'
 import { defineNuxtPlugin } from '#imports'
-import { createLogger } from 'virtual:nuxt-i18n-logger'
+import { createLogger } from '#nuxt-i18n/logger'
 import { detectBrowserLanguage } from '../internal'
 import type { NuxtApp } from '#app'
 

src/runtime/plugins/route-locale-detect.ts

@@ -19,7 +19,7 @@ import {
 } from './internal'
 import { loadAndSetLocaleMessages, loadLocale, loadVueI18nOptions, makeFallbackLocaleCodes } from './messages'
 import { localePath, switchLocalePath } from './routing/routing'
-import { createLogger } from 'virtual:nuxt-i18n-logger'
+import { createLogger } from '#nuxt-i18n/logger'
 import { unref } from 'vue'
 
 import type { I18n, Locale, I18nOptions } from 'vue-i18n'

src/runtime/plugins/ssg-detect.ts

@@ -21,7 +21,7 @@ export function asVirtualId(id: string, framework: UnpluginContextMeta['framewor
 }
 
 export function asI18nVirtual(val: string) {
-  return NUXT_I18N_VIRTUAL_PREFIX + '-' + val
+  return NUXT_I18N_VIRTUAL_PREFIX + '/' + val
 }
 
 // from https://github.com/nuxt/nuxt/blob/a80d1a0d6349bf1003666fc79a513c0d7370c931/packages/nuxt/src/core/utils/plugins.ts#L4-L35