fix(unplugin-vue-i18n): resource resolving and alias resolving (#201)

packages/unplugin-vue-i18n/package.json

@@ -26,15 +26,15 @@
     }
   },
   "dependencies": {
-    "@intlify/bundle-utils": "^3.2.1",
+    "@intlify/bundle-utils": "^3.4.0",
     "@intlify/shared": "next",
     "@rollup/pluginutils": "^4.2.0",
-    "@vue/compiler-sfc": "^3.2.23",
+    "@vue/compiler-sfc": "^3.2.45",
     "debug": "^4.3.1",
     "fast-glob": "^3.2.5",
     "js-yaml": "^4.1.0",
     "json5": "^2.2.0",
-    "pathe": "^0.2.0",
+    "pathe": "^0.3.9",
     "picocolors": "^1.0.0",
     "source-map": "0.6.1",
     "unplugin": "^0.8.0"

packages/unplugin-vue-i18n/src/index.ts

@@ -17,7 +17,8 @@ import {
   generateJSON,
   generateYAML,
   checkInstallPackage,
-  checkVueI18nBridgeInstallPackage
+  checkVueI18nBridgeInstallPackage,
+  getVueI18nVersion
 } from '@intlify/bundle-utils'
 import { RawSourceMap } from 'source-map'
 import { parse } from '@vue/compiler-sfc'
@@ -38,6 +39,7 @@ const debug = createDebug('unplugin-vue-i18n')
 
 const installedPkg = checkInstallPackage('@intlify/unplugin-vue-i18n', debug)
 const installedVueI18nBridge = checkVueI18nBridgeInstallPackage(debug)
+const vueI18nVersion = getVueI18nVersion(debug)
 
 export const unplugin = createUnplugin<PluginOptions>((options = {}, meta) => {
   debug('plugin options:', options, meta.framework)
@@ -99,20 +101,29 @@ export const unplugin = createUnplugin<PluginOptions>((options = {}, meta) => {
   debug('useVueI18nImportName', useVueI18nImportName)
 
   // prettier-ignore
-  const getAliasName = () =>
-    installedVueI18nBridge && installedPkg === 'vue-i18n'
-      ? 'vue-i18n-bridge'
-      : installedPkg === 'petite-vue-i18n' && isBoolean(useVueI18nImportName) &&
-        useVueI18nImportName
+  const getVueI18nAliasName = () =>
+    vueI18nVersion === '9' || vueI18nVersion === '8'
+      ? 'vue-i18n'
+      : vueI18nVersion === 'unknown' && installedPkg === 'petite-vue-i18n' && isBoolean(useVueI18nImportName) && useVueI18nImportName
         ? 'vue-i18n'
-        : `${installedPkg}`
+        : installedPkg
+
+  const getVueI18nBridgeAliasPath = () =>
+    `vue-i18n-bridge/dist/vue-i18n-bridge.runtime.esm-bundler.js`
+
+  const getVueI18nAliasPath = (aliasName: string) =>
+    vueI18nVersion === '8'
+      ? `${aliasName}/dist/${aliasName}.esm.js` // for vue-i18n@8
+      : `${aliasName}/dist/${installedPkg}.runtime.esm-bundler.js`
 
   const esm = isBoolean(options.esm) ? options.esm : true
   debug('esm', esm)
 
   let isProduction = false
   let sourceMap = false
 
+  const vueI18nAliasName = getVueI18nAliasName()
+
   return {
     name: 'unplugin-vue-i18n',
 
@@ -132,23 +143,40 @@ export const unplugin = createUnplugin<PluginOptions>((options = {}, meta) => {
           config.resolve,
           meta.framework
         )
+
         if (command === 'build' && runtimeOnly) {
-          const aliasName = getAliasName()
-          debug(`alias name: ${aliasName}`)
+          debug(`vue-i18n alias name: ${vueI18nAliasName}`)
           if (isArray(config.resolve!.alias)) {
             config.resolve!.alias.push({
-              find: aliasName,
-              replacement: `${aliasName}/dist/${aliasName}.runtime.esm-bundler.js`
+              find: vueI18nAliasName,
+              replacement: getVueI18nAliasPath(vueI18nAliasName)
             })
+            if (installedVueI18nBridge) {
+              config.resolve!.alias.push({
+                find: 'vue-i18n-bridge',
+                replacement: getVueI18nBridgeAliasPath()
+              })
+            }
           } else if (isObject(config.resolve!.alias)) {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            ;(config.resolve!.alias as any)[
-              aliasName
-            ] = `${aliasName}/dist/${aliasName}.runtime.esm-bundler.js`
+            ;(config.resolve!.alias as any)[vueI18nAliasName] =
+              getVueI18nAliasPath(vueI18nAliasName)
+            if (installedVueI18nBridge) {
+              // eslint-disable-next-line @typescript-eslint/no-explicit-any
+              ;(config.resolve!.alias as any)['vue-i18n-bridge'] =
+                getVueI18nBridgeAliasPath()
+            }
           }
           debug(
-            `set ${aliasName} runtime only: ${aliasName}/dist/${aliasName}.runtime.esm-bundler.js`
+            `set ${vueI18nAliasName} runtime only: ${getVueI18nAliasPath(
+              vueI18nAliasName
+            )}`
           )
+          if (installedVueI18nBridge) {
+            debug(
+              `set vue-i18n-bridge runtime only: ${getVueI18nBridgeAliasPath()}`
+            )
+          }
         } else if (
           command === 'serve' &&
           installedPkg === 'petite-vue-i18n' &&
@@ -160,16 +188,16 @@ export const unplugin = createUnplugin<PluginOptions>((options = {}, meta) => {
           )
           if (isArray(config.resolve!.alias)) {
             config.resolve!.alias.push({
-              find: 'vue-i18n',
+              find: vueI18nAliasName,
               replacement: `petite-vue-i18n/dist/petite-vue-i18n.esm-bundler.js`
             })
           } else {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             ;(config.resolve!.alias as any)[
-              'vue-i18n'
+              vueI18nAliasName
             ] = `petite-vue-i18n/dist/petite-vue-i18n.esm-bundler.js`
           }
-          debug(`alias name: ${getAliasName()}`)
+          debug(`petite-vue-i18n alias name: ${vueI18nAliasName}`)
         }
 
         config.define = config.define || {}
@@ -239,15 +267,40 @@ export const unplugin = createUnplugin<PluginOptions>((options = {}, meta) => {
       sourceMap = !!compiler.options.devtool
       debug(`webpack: isProduction = ${isProduction}, sourceMap = ${sourceMap}`)
 
+      compiler.options.resolve = normalizeConfigResolveAlias(
+        compiler.options.resolve,
+        meta.framework
+      )
+
       if (isProduction && runtimeOnly) {
-        compiler.options.resolve = normalizeConfigResolveAlias(
-          compiler.options.resolve,
-          meta.framework
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        ;(compiler.options.resolve!.alias as any)[vueI18nAliasName] =
+          getVueI18nAliasPath(vueI18nAliasName)
+        if (installedVueI18nBridge) {
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
+          ;(compiler.options.resolve!.alias as any)['vue-i18n-bridge'] =
+            getVueI18nBridgeAliasPath()
+        }
+        debug(
+          `set ${vueI18nAliasName} runtime only: ${getVueI18nAliasPath(
+            vueI18nAliasName
+          )}`
         )
+        if (installedVueI18nBridge) {
+          debug(
+            `set vue-i18n-bridge runtime only: ${getVueI18nBridgeAliasPath()}`
+          )
+        }
+      } else if (
+        !isProduction &&
+        installedPkg === 'petite-vue-i18n' &&
+        useVueI18nImportName
+      ) {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         ;(compiler.options.resolve!.alias as any)[
-          'vue-i18n'
-        ] = `vue-i18n/dist/vue-i18n.runtime.esm-bundler.js`
+          vueI18nAliasName
+        ] = `petite-vue-i18n/dist/petite-vue-i18n.esm-bundler.js`
+        debug(`petite-vue-i18n alias name: ${vueI18nAliasName}`)
       }
 
       loadWebpack().then(webpack => {
@@ -274,7 +327,9 @@ export const unplugin = createUnplugin<PluginOptions>((options = {}, meta) => {
         compiler.options.module.rules.push({
           test: /\.(json5?|ya?ml)$/,
           type: 'javascript/auto',
-          exclude: include // exclude target i18n resources
+          include(resource: string) {
+            return filter(resource)
+          }
         })
       }
 

yarn.lock

@@ -798,7 +798,7 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@intlify/bundle-utils@^3.1.2, @intlify/bundle-utils@^3.2.1, @intlify/bundle-utils@workspace:packages/bundle-utils":
+"@intlify/bundle-utils@^3.1.2, @intlify/bundle-utils@^3.4.0, @intlify/bundle-utils@workspace:packages/bundle-utils":
   version: 0.0.0-use.local
   resolution: "@intlify/bundle-utils@workspace:packages/bundle-utils"
   dependencies:
@@ -895,16 +895,16 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@intlify/unplugin-vue-i18n@workspace:packages/unplugin-vue-i18n"
   dependencies:
-    "@intlify/bundle-utils": ^3.2.1
+    "@intlify/bundle-utils": ^3.4.0
     "@intlify/shared": next
     "@rollup/pluginutils": ^4.2.0
-    "@vue/compiler-sfc": ^3.2.23
+    "@vue/compiler-sfc": ^3.2.45
     debug: ^4.3.1
     fast-glob: ^3.2.5
     js-yaml: ^4.1.0
     json5: ^2.2.0
     mlly: ^0.5.2
-    pathe: ^0.2.0
+    pathe: ^0.3.9
     picocolors: ^1.0.0
     source-map: 0.6.1
     unbuild: ^0.8.11
@@ -2427,6 +2427,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/compiler-core@npm:3.2.45":
+  version: 3.2.45
+  resolution: "@vue/compiler-core@npm:3.2.45"
+  dependencies:
+    "@babel/parser": ^7.16.4
+    "@vue/shared": 3.2.45
+    estree-walker: ^2.0.2
+    source-map: ^0.6.1
+  checksum: e3c687b24c16c2b320c02ed38960f8bee7dcb88bddb09e60a80d2d4dc004070cbbd4eccbc99cc168d48d753ff60d0b9eefba835e1dec3b7f233a98c89af31c07
+  languageName: node
+  linkType: hard
+
 "@vue/compiler-dom@npm:3.2.23":
   version: 3.2.23
   resolution: "@vue/compiler-dom@npm:3.2.23"
@@ -2447,6 +2459,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/compiler-dom@npm:3.2.45":
+  version: 3.2.45
+  resolution: "@vue/compiler-dom@npm:3.2.45"
+  dependencies:
+    "@vue/compiler-core": 3.2.45
+    "@vue/shared": 3.2.45
+  checksum: 89115538635f0da9cce615de5488d2759256fa573976a09a049536dbb94e9b5086b46f2f11e743cf0a7b14837161b3191c67611e0493054a5d4c4b96a322c901
+  languageName: node
+  linkType: hard
+
 "@vue/compiler-sfc@npm:3.2.23":
   version: 3.2.23
   resolution: "@vue/compiler-sfc@npm:3.2.23"
@@ -2483,6 +2505,24 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/compiler-sfc@npm:^3.2.45":
+  version: 3.2.45
+  resolution: "@vue/compiler-sfc@npm:3.2.45"
+  dependencies:
+    "@babel/parser": ^7.16.4
+    "@vue/compiler-core": 3.2.45
+    "@vue/compiler-dom": 3.2.45
+    "@vue/compiler-ssr": 3.2.45
+    "@vue/reactivity-transform": 3.2.45
+    "@vue/shared": 3.2.45
+    estree-walker: ^2.0.2
+    magic-string: ^0.25.7
+    postcss: ^8.1.10
+    source-map: ^0.6.1
+  checksum: bec375faa0012e953dc0887482cc01d52003ad424b6a8a9c8a2506fd4f0197ad62be22f77ce5691c2306068ae7bc0028399f25399e7d4beee668285d431f4d8f
+  languageName: node
+  linkType: hard
+
 "@vue/compiler-ssr@npm:3.2.23":
   version: 3.2.23
   resolution: "@vue/compiler-ssr@npm:3.2.23"
@@ -2503,6 +2543,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/compiler-ssr@npm:3.2.45":
+  version: 3.2.45
+  resolution: "@vue/compiler-ssr@npm:3.2.45"
+  dependencies:
+    "@vue/compiler-dom": 3.2.45
+    "@vue/shared": 3.2.45
+  checksum: 830c475506d2b6d1a6872b3fde1024ef5132f725121fd9c34832c5cefcc8cfddf0dcaa3acc9b2da4754162fccdff48b3275b9ff31415a7793b224c04355dc632
+  languageName: node
+  linkType: hard
+
 "@vue/component-compiler-utils@npm:^3.1.0":
   version: 3.3.0
   resolution: "@vue/component-compiler-utils@npm:3.3.0"
@@ -2543,6 +2593,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/reactivity-transform@npm:3.2.45":
+  version: 3.2.45
+  resolution: "@vue/reactivity-transform@npm:3.2.45"
+  dependencies:
+    "@babel/parser": ^7.16.4
+    "@vue/compiler-core": 3.2.45
+    "@vue/shared": 3.2.45
+    estree-walker: ^2.0.2
+    magic-string: ^0.25.7
+  checksum: 401040818947eb04c782487a7861d3ba20f95c9f3ca14282b3d7624002bfe6000547bb48c561afe87ae6d302143fec71a7e0bc3ed3ae2bfad8a228adf7fd90d6
+  languageName: node
+  linkType: hard
+
 "@vue/reactivity@npm:3.2.23":
   version: 3.2.23
   resolution: "@vue/reactivity@npm:3.2.23"
@@ -2612,6 +2675,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/shared@npm:3.2.45":
+  version: 3.2.45
+  resolution: "@vue/shared@npm:3.2.45"
+  checksum: ff3205056caed2a965aa0980e21319515ce13c859a9b269fdab0ee8b3c9f3d8eec7eefdb7fd6c6b47c12acdc7bf23c6c187b6191054221b4a29108139b20c221
+  languageName: node
+  linkType: hard
+
 "@webassemblyjs/ast@npm:1.11.1":
   version: 1.11.1
   resolution: "@webassemblyjs/ast@npm:1.11.1"
@@ -11324,6 +11394,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"pathe@npm:^0.3.9":
+  version: 0.3.9
+  resolution: "pathe@npm:0.3.9"
+  checksum: 9afcbaa79c5f8ec603b6b0a20b9accfcec8de57e26738f4a844de4625cfb07cc733b7234387ef42c7ab23a49b91846b6b51cb247584793842a3179539af463df
+  languageName: node
+  linkType: hard
+
 "pbkdf2@npm:^3.0.3":
   version: 3.1.2
   resolution: "pbkdf2@npm:3.1.2"