@intlify/unplugin-vue-i18n 0.4.0 → 0.6.0

package/CHANGELOG.md

@@ -0,0 +1,94 @@
+
+## @intlify/unplugin-vue-i18n@0.6.0 (2022-09-19)
+
+#### :bug: Bug Fixes
+* [#180](https://github.com/intlify/bundle-tools/pull/180) fix(unplugin-vue-i18n): improve compilation error handling ([@kazupon](https://github.com/kazupon))
+
+#### Committers: 1
+- kazuya kawaguchi ([@kazupon](https://github.com/kazupon))
+
+
+## @intlify/unplugin-vue-i18n@0.5.0 (2022-07-26)
+
+#### :star: Features
+* [#156](https://github.com/intlify/bundle-tools/pull/156) feat(unplugin-vue-i18n): support petite-vue-i18n and useVueI18nImportName option ([@kazupon](https://github.com/kazupon))
+
+#### :zap: Improvement Features
+* [#155](https://github.com/intlify/bundle-tools/pull/155) fix(unplugin-vue-i18n): improve wrong virtual module implementation ([@kazupon](https://github.com/kazupon))
+* [#154](https://github.com/intlify/bundle-tools/pull/154) fix(unplugin-vue-i18n): support unplugin v0.8 ([@kazupon](https://github.com/kazupon))
+
+#### Committers: 1
+- kazuya kawaguchi ([@kazupon](https://github.com/kazupon))
+
+
+## @intlify/unplugin-vue-i18n@0.4.0 (2022-07-07)
+
+#### :star: Features
+* [#138](https://github.com/intlify/bundle-tools/pull/138) feat(unplugin-vue-i18n): support esm options for bridge ([@kazupon](https://github.com/kazupon))
+
+#### Committers: 1
+- kazuya kawaguchi ([@kazupon](https://github.com/kazupon))
+
+
+## @intlify/unplugin-vue-i18n@0.3.0 (2022-07-07)
+
+#### :star: Features
+* [#136](https://github.com/intlify/bundle-tools/pull/136) feat(unplugin-vue-i18n): support fullinstall option ([@kazupon](https://github.com/kazupon))
+* [#135](https://github.com/intlify/bundle-tools/pull/135) feat(unplugin-vue-i18n): support composition only option ([@kazupon](https://github.com/kazupon))
+* [#134](https://github.com/intlify/bundle-tools/pull/134) feat(unplugin-vue-i18n): support runtimeOnly option ([@kazupon](https://github.com/kazupon))
+
+#### :pencil: Documentation
+* [#133](https://github.com/intlify/bundle-tools/pull/133) docs: consistent plugin name and add Nuxt ([@Atinux](https://github.com/Atinux))
+
+#### Committers: 2
+- Sébastien Chopin ([@Atinux](https://github.com/Atinux))
+- kazuya kawaguchi ([@kazupon](https://github.com/kazupon))
+
+
+## @intlify/unplugin-vue-i18n@0.2.1 (2022-05-07)
+
+#### :bug: Bug Fixes
+* [#118](https://github.com/intlify/bundle-tools/pull/118) fix(unplugin-vue-i18n): code transforming strictly ([@kazupon](https://github.com/kazupon))
+
+#### Committers: 1
+- kazuya kawaguchi ([@kazupon](https://github.com/kazupon))
+
+
+## @intlify/unplugin-vue-i18n@0.2.0 (2022-05-06)
+
+#### :star: Features
+* [#117](https://github.com/intlify/bundle-tools/pull/117) feat: support virtual resource importing ([@kazupon](https://github.com/kazupon))
+
+#### Committers: 1
+- kazuya kawaguchi ([@kazupon](https://github.com/kazupon))
+
+
+## @intlify/unplugin-vue-i18n@0.1.2 (2022-05-06)
+
+#### :bug: Bug Fixes
+* [#115](https://github.com/intlify/bundle-tools/pull/115) fix(unplugin-vue-i18n): export d.ts files ([@kazupon](https://github.com/kazupon))
+
+#### Committers: 1
+- kazuya kawaguchi ([@kazupon](https://github.com/kazupon))
+
+
+## @intlify/unplugin-vue-i18n@0.1.1 (2022-05-06)
+
+#### :bug: Bug Fixes
+* [#114](https://github.com/intlify/bundle-tools/pull/114) fix(unplugin-vue-i18n): export types ([@kazupon](https://github.com/kazupon))
+
+#### Committers: 1
+- kazuya kawaguchi ([@kazupon](https://github.com/kazupon))
+
+
+## @intlify/unplugin-vue-i18n@0.1.0 (2022-05-06)
+
+#### :star: Features
+* [#113](https://github.com/intlify/bundle-tools/pull/113) feat: unplugin basic implementation for vue-i18n ([@kazupon](https://github.com/kazupon))
+
+#### Committers: 1
+- kazuya kawaguchi ([@kazupon](https://github.com/kazupon))
+
+## @intlify/unplugin-vue-i18n@0.0.0 (2022-05-02)
+
+:tada: Initial release.

package/README.md

@@ -237,6 +237,13 @@ This plugin will automatically select and bundle Vue I18n build according to the
 
 About details, See the [here](https://vue-i18n.intlify.dev/guide/advanced/optimization.html#improve-performance-and-reduce-bundle-size-with-runtime-build-only)
 
+### For `petite-vue-i18n`
+
+This plugin will automatically select and bundle `petite-vue-i18n` build according to the following vite behavior:
+
+- vite dev: `petite-vue-i18n.esm-bundler.js`
+- vite build: `petite-vue-i18n.runtime.esm-bundler.js`
+
 
 ## 🔧 Options
 
@@ -428,9 +435,15 @@ About details, See the [here](https://vue-i18n.intlify.dev/guide/advanced/optimi
 
   This option that to use i18n custom blocks in `vue-class-component`.
 
+### `useVueI18nImportName` (Experimental)
+
+- **Type:** `boolean`
+- **Default:** `false`
+
+  Whether to use the import name of `petite-vue-i18n` with the same import name as vue-i18n (`import { xxx } from 'vue-i18n'`).
+
+  This option allows a smooth migration from `petite-vue-i18n` to `vue-i18n` and allows progressive enhacement.
 
-## ✅ TODO
-- [ ] Bundling optimizations
 
 ## 📜 Changelog
 

package/lib/index.cjs

@@ -13,6 +13,7 @@ const compilerSfc = require('@vue/compiler-sfc');
 const JSON5 = require('json5');
 const yaml = require('js-yaml');
 const fs = require('fs');
+const pc = require('picocolors');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e["default"] : e; }
 
@@ -20,12 +21,15 @@ const createDebug__default = /*#__PURE__*/_interopDefaultLegacy(createDebug);
 const fg__default = /*#__PURE__*/_interopDefaultLegacy(fg);
 const JSON5__default = /*#__PURE__*/_interopDefaultLegacy(JSON5);
 const yaml__default = /*#__PURE__*/_interopDefaultLegacy(yaml);
+const pc__default = /*#__PURE__*/_interopDefaultLegacy(pc);
 
 function parseVueRequest(id) {
   const [filename, rawQuery] = id.split(`?`, 2);
   const params = new URLSearchParams(rawQuery);
   const ret = {};
-  const langPart = Object.keys(Object.fromEntries(params)).find((key) => /lang\./i.test(key));
+  const langPart = Object.keys(Object.fromEntries(params)).find(
+    (key) => /lang\./i.test(key)
+  );
   ret.vue = params.has("vue");
   ret.global = params.has("global");
   ret.src = params.has("src");
@@ -81,10 +85,10 @@ function convert(source, lang) {
 }
 
 function warn(...args) {
-  console.warn(`[unplugin-vue-i18n] `, ...args);
+  console.warn(pc__default.yellow(pc__default.bold(`[unplugin-vue-i18n] `)), ...args);
 }
 function error(...args) {
-  console.error(`[unplugin-vue-i18n] `, ...args);
+  console.error(pc__default.red(pc__default.bold(`[unplugin-vue-i18n] `)), ...args);
 }
 async function getRaw(path) {
   return fs.promises.readFile(path, { encoding: "utf-8" });
@@ -95,7 +99,9 @@ function raiseError(message) {
 
 const INTLIFY_BUNDLE_IMPORT_ID = "@intlify/unplugin-vue-i18n/messages";
 const INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID = "@intlify/vite-plugin-vue-i18n/messages";
+const VIRTUAL_PREFIX = "\0";
 const debug = createDebug__default("unplugin-vue-i18n");
+const installedPkg = bundleUtils.checkInstallPackage("@intlify/unplugin-vue-i18n", debug);
 const unplugin = unplugin$1.createUnplugin((options = {}, meta) => {
   debug("plugin options:", options, meta.framework);
   if (!["vite", "webpack"].includes(meta.framework)) {
@@ -118,10 +124,16 @@ const unplugin = unplugin$1.createUnplugin((options = {}, meta) => {
   debug("bridge", bridge);
   const runtimeOnly = shared.isBoolean(options.runtimeOnly) ? options.runtimeOnly : true;
   debug("runtimeOnly", runtimeOnly);
-  const compositionOnly = shared.isBoolean(options.compositionOnly) ? options.compositionOnly : true;
+  const compositionOnly = installedPkg === "vue-i18n" ? shared.isBoolean(options.compositionOnly) ? options.compositionOnly : true : true;
   debug("compositionOnly", compositionOnly);
-  const fullInstall = shared.isBoolean(options.fullInstall) ? options.fullInstall : true;
+  const fullInstall = installedPkg === "vue-i18n" ? shared.isBoolean(options.fullInstall) ? options.fullInstall : true : false;
   debug("fullInstall", fullInstall);
+  const useVueI18nImportName = options.useVueI18nImportName;
+  if (useVueI18nImportName != null) {
+    warn(`'useVueI18nImportName' option is experimental`);
+  }
+  debug("useVueI18nImportName", useVueI18nImportName);
+  const getAliasName = () => installedPkg === "petite-vue-i18n" && shared.isBoolean(useVueI18nImportName) && useVueI18nImportName ? "vue-i18n" : `${installedPkg}`;
   const esm = shared.isBoolean(options.esm) ? options.esm : true;
   debug("esm", esm);
   let isProduction = false;
@@ -129,39 +141,51 @@ const unplugin = unplugin$1.createUnplugin((options = {}, meta) => {
   return {
     name: "unplugin-vue-i18n",
     enforce: meta.framework === "vite" ? "pre" : "post",
-    transformInclude(id) {
-      debug("transformInclude", id);
-      if (meta.framework === "vite") {
-        return true;
-      } else {
-        const { filename } = parseVueRequest(id);
-        return filename.endsWith("vue") || filename.endsWith(INTLIFY_BUNDLE_IMPORT_ID) || filename.endsWith(INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID) ? true : /\.(json5?|ya?ml)$/.test(id) && filter(id);
-      }
-    },
     vite: {
       config(config, { command }) {
         normalizeConfigResolveAlias(config.resolve, meta.framework);
         if (command === "build" && runtimeOnly) {
           if (shared.isArray(config.resolve.alias)) {
             config.resolve.alias.push({
-              find: "vue-i18n",
-              replacement: `vue-i18n/dist/vue-i18n.runtime.esm-bundler.js`
+              find: getAliasName(),
+              replacement: `${installedPkg}/dist/${installedPkg}.runtime.esm-bundler.js`
             });
           } else if (shared.isObject(config.resolve.alias)) {
-            config.resolve.alias["vue-i18n"] = `vue-i18n/dist/vue-i18n.runtime.esm-bundler.js`;
+            config.resolve.alias[getAliasName()] = `${installedPkg}/dist/${installedPkg}.runtime.esm-bundler.js`;
           }
+          debug(`alias name: ${getAliasName()}`);
+          debug(
+            `set ${installedPkg} runtime only: ${installedPkg}/dist/${installedPkg}.runtime.esm-bundler.js`
+          );
+        } else if (command === "serve" && installedPkg === "petite-vue-i18n" && useVueI18nImportName) {
+          normalizeConfigResolveAlias(config.resolve, meta.framework);
+          if (shared.isArray(config.resolve.alias)) {
+            config.resolve.alias.push({
+              find: "vue-i18n",
+              replacement: `petite-vue-i18n/dist/petite-vue-i18n.esm-bundler.js`
+            });
+          } else {
+            config.resolve.alias["vue-i18n"] = `petite-vue-i18n/dist/petite-vue-i18n.esm-bundler.js`;
+          }
+          debug(`alias name: ${getAliasName()}`);
         }
         config.define = config.define || {};
         config.define["__VUE_I18N_LEGACY_API__"] = !compositionOnly;
-        debug(`set __VUE_I18N_LEGACY_API__ is '${config.define["__VUE_I18N_LEGACY_API__"]}'`);
+        debug(
+          `set __VUE_I18N_LEGACY_API__ is '${config.define["__VUE_I18N_LEGACY_API__"]}'`
+        );
         config.define["__VUE_I18N_FULL_INSTALL__"] = fullInstall;
-        debug(`set __VUE_I18N_FULL_INSTALL__ is '${config.define["__VUE_I18N_FULL_INSTALL__"]}'`);
+        debug(
+          `set __VUE_I18N_FULL_INSTALL__ is '${config.define["__VUE_I18N_FULL_INSTALL__"]}'`
+        );
         config.define["__VUE_I18N_PROD_DEVTOOLS__"] = false;
       },
       configResolved(config) {
         isProduction = config.isProduction;
         sourceMap = config.command === "build" ? !!config.build.sourcemap : false;
-        debug(`configResolved: isProduction = ${isProduction}, sourceMap = ${sourceMap}`);
+        debug(
+          `configResolved: isProduction = ${isProduction}, sourceMap = ${sourceMap}`
+        );
         const jsonPlugin = config.plugins.find((p) => p.name === "vite:json");
         if (jsonPlugin) {
           const orgTransform = jsonPlugin.transform;
@@ -189,11 +213,13 @@ const unplugin = unplugin$1.createUnplugin((options = {}, meta) => {
       }
       loadWebpack().then((webpack) => {
         if (webpack) {
-          compiler.options.plugins.push(new webpack.DefinePlugin({
-            __VUE_I18N_LEGACY_API__: JSON.stringify(compositionOnly),
-            __VUE_I18N_FULL_INSTALL__: JSON.stringify(fullInstall),
-            __INTLIFY_PROD_DEVTOOLS__: "false"
-          }));
+          compiler.options.plugins.push(
+            new webpack.DefinePlugin({
+              __VUE_I18N_LEGACY_API__: JSON.stringify(compositionOnly),
+              __VUE_I18N_FULL_INSTALL__: JSON.stringify(fullInstall),
+              __INTLIFY_PROD_DEVTOOLS__: "false"
+            })
+          );
           debug(`set __VUE_I18N_LEGACY_API__ is '${compositionOnly}'`);
           debug(`set __VUE_I18N_FULL_INSTALL__ is '${fullInstall}'`);
         } else {
@@ -211,35 +237,55 @@ const unplugin = unplugin$1.createUnplugin((options = {}, meta) => {
     resolveId(id, importer) {
       debug("resolveId", id, importer);
       if (id === INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID) {
-        warn(`deprected '${INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID}', you should switch to '${INTLIFY_BUNDLE_IMPORT_ID}'`);
-        return id;
+        warn(
+          `deprected '${INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID}', you should switch to '${INTLIFY_BUNDLE_IMPORT_ID}'`
+        );
+        return asVirtualId(id, meta.framework);
       }
       if (id === INTLIFY_BUNDLE_IMPORT_ID) {
-        return id;
+        return asVirtualId(id, meta.framework);
       }
     },
     async load(id) {
       debug("load", id);
       const { query } = parseVueRequest(id);
-      if ([INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID, INTLIFY_BUNDLE_IMPORT_ID].includes(id) && include) {
+      if ([INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID, INTLIFY_BUNDLE_IMPORT_ID].includes(
+        getVirtualId(id, meta.framework)
+      ) && include) {
         let resourcePaths = [];
         const includePaths = shared.isArray(include) ? include : [include];
         for (const inc of includePaths) {
           resourcePaths = [...resourcePaths, ...await fg__default(inc)];
         }
-        resourcePaths = resourcePaths.filter((el, pos) => resourcePaths.indexOf(el) === pos);
-        const code = await generateBundleResources(resourcePaths, query, isProduction, {
-          forceStringify,
-          bridge,
-          exportESM: esm,
-          useClassComponent
-        });
+        resourcePaths = resourcePaths.filter(
+          (el, pos) => resourcePaths.indexOf(el) === pos
+        );
+        const code = await generateBundleResources(
+          resourcePaths,
+          query,
+          isProduction,
+          {
+            forceStringify,
+            bridge,
+            exportESM: esm,
+            useClassComponent
+          }
+        );
         return {
           code,
           map: { mappings: "" }
         };
       }
     },
+    transformInclude(id) {
+      debug("transformInclude", id);
+      if (meta.framework === "vite") {
+        return true;
+      } else {
+        const { filename } = parseVueRequest(id);
+        return filename.endsWith("vue") || filename.endsWith(INTLIFY_BUNDLE_IMPORT_ID) || filename.endsWith(INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID) || /\.(json5?|ya?ml)$/.test(filename) && filter(filename);
+      }
+    },
     async transform(code, id) {
       const { filename, query } = parseVueRequest(id);
       debug("transform", id, JSON.stringify(query), filename);
@@ -249,16 +295,26 @@ const unplugin = unplugin$1.createUnplugin((options = {}, meta) => {
         if (/\.(json5?|ya?ml)$/.test(id) && filter(id)) {
           langInfo = pathe.parse(filename).ext;
           const generate = /\.?json5?/.test(langInfo) ? bundleUtils.generateJSON : bundleUtils.generateYAML;
-          const parseOptions = getOptions(filename, isProduction, query, sourceMap, {
-            inSourceMap,
-            isGlobal: globalSFCScope,
-            useClassComponent,
-            bridge,
-            exportESM: esm,
-            forceStringify
-          });
+          const parseOptions = getOptions(
+            filename,
+            isProduction,
+            query,
+            sourceMap,
+            {
+              inSourceMap,
+              isGlobal: globalSFCScope,
+              useClassComponent,
+              bridge,
+              exportESM: esm,
+              forceStringify
+            }
+          );
           debug("parseOptions", parseOptions);
-          const { code: generatedCode, map } = generate(code, parseOptions, bridge ? createBridgeCodeGenerator(code, query) : void 0);
+          const { code: generatedCode, map } = generate(
+            code,
+            parseOptions,
+            bridge ? createBridgeCodeGenerator(code, query) : void 0
+          );
           debug("generated code", generatedCode);
           debug("sourcemap", map, sourceMap);
           if (code === generatedCode)
@@ -282,17 +338,33 @@ const unplugin = unplugin$1.createUnplugin((options = {}, meta) => {
           }
           debug("langInfo", langInfo);
           const generate = /\.?json5?/.test(langInfo) ? bundleUtils.generateJSON : bundleUtils.generateYAML;
-          const parseOptions = getOptions(filename, isProduction, query, sourceMap, {
-            inSourceMap,
-            isGlobal: globalSFCScope,
-            useClassComponent,
-            bridge,
-            exportESM: esm,
-            forceStringify
-          });
+          const parseOptions = getOptions(
+            filename,
+            isProduction,
+            query,
+            sourceMap,
+            {
+              inSourceMap,
+              isGlobal: globalSFCScope,
+              useClassComponent,
+              bridge,
+              exportESM: esm,
+              forceStringify
+            }
+          );
           debug("parseOptions", parseOptions);
-          const source = await getCode(code, filename, sourceMap, query, meta.framework);
-          const { code: generatedCode, map } = generate(source, parseOptions, bridge ? createBridgeCodeGenerator(source, query) : void 0);
+          const source = await getCode(
+            code,
+            filename,
+            sourceMap,
+            query,
+            meta.framework
+          );
+          const { code: generatedCode, map } = generate(
+            source,
+            parseOptions,
+            bridge ? createBridgeCodeGenerator(source, query) : void 0
+          );
           debug("generated code", generatedCode);
           debug("sourcemap", map, sourceMap);
           if (code === generatedCode)
@@ -329,7 +401,7 @@ async function loadWebpack() {
   try {
     webpack = await import('webpack').then((m) => m.default || m);
   } catch (e) {
-    console.warn(`[@intlify/unplugin-vue-i18n] webpack not found, please install webpack.`);
+    warn(`webpack not found, please install webpack.`);
   }
   return webpack;
 }
@@ -355,7 +427,11 @@ async function generateBundleResources(resources, query, isProduction, {
         forceStringify
       });
       parseOptions.type = "bare";
-      const { code } = generate(source, parseOptions, bridge ? createBridgeCodeGenerator(source, query) : void 0);
+      const { code } = generate(
+        source,
+        parseOptions,
+        bridge ? createBridgeCodeGenerator(source, query) : void 0
+      );
       debug("generated code", code);
       codes.push(`${JSON.stringify(name)}: ${code}`);
     }
@@ -416,8 +492,20 @@ function getOptions(filename, isProduction, query, sourceMap, {
     onWarn: (msg) => {
       warn(`${filename} ${msg}`);
     },
-    onError: (msg) => {
-      error(`${filename} ${msg}`);
+    onError: (msg, extra) => {
+      const codeFrame = shared.generateCodeFrame(
+        extra?.source || extra?.location?.source || "",
+        extra?.location?.start.column,
+        extra?.location?.end.column
+      );
+      const errMssage = `${msg} (error code: ${extra?.code}) in ${filename}
+  target message: ${extra?.source}
+  target message path: ${extra?.path}
+
+  ${codeFrame}
+`;
+      error(errMssage);
+      throw new Error(errMssage);
     }
   };
   if (isCustomBlock(query)) {
@@ -433,6 +521,12 @@ function getOptions(filename, isProduction, query, sourceMap, {
     });
   }
 }
+function getVirtualId(id, framework = "vite") {
+  return framework === "vite" ? id.startsWith(VIRTUAL_PREFIX) ? id.slice(VIRTUAL_PREFIX.length) : "" : id;
+}
+function asVirtualId(id, framework = "vite") {
+  return framework === "vite" ? VIRTUAL_PREFIX + id : id;
+}
 
 exports["default"] = unplugin;
 exports.unplugin = unplugin;

package/lib/index.mjs

@@ -2,19 +2,22 @@ import { createUnplugin } from 'unplugin';
 import { normalize, parse } from 'pathe';
 import createDebug from 'debug';
 import fg from 'fast-glob';
-import { isString, isArray, isBoolean, isObject, isEmptyObject, isNumber, assign } from '@intlify/shared';
+import { isString, isArray, isBoolean, isObject, isNumber, isEmptyObject, assign, generateCodeFrame } from '@intlify/shared';
 import { createFilter } from '@rollup/pluginutils';
-import { generateJSON, generateYAML } from '@intlify/bundle-utils';
+import { checkInstallPackage, generateJSON, generateYAML } from '@intlify/bundle-utils';
 import { parse as parse$1 } from '@vue/compiler-sfc';
 import JSON5 from 'json5';
 import yaml from 'js-yaml';
 import { promises } from 'fs';
+import pc from 'picocolors';
 
 function parseVueRequest(id) {
   const [filename, rawQuery] = id.split(`?`, 2);
   const params = new URLSearchParams(rawQuery);
   const ret = {};
-  const langPart = Object.keys(Object.fromEntries(params)).find((key) => /lang\./i.test(key));
+  const langPart = Object.keys(Object.fromEntries(params)).find(
+    (key) => /lang\./i.test(key)
+  );
   ret.vue = params.has("vue");
   ret.global = params.has("global");
   ret.src = params.has("src");
@@ -70,10 +73,10 @@ function convert(source, lang) {
 }
 
 function warn(...args) {
-  console.warn(`[unplugin-vue-i18n] `, ...args);
+  console.warn(pc.yellow(pc.bold(`[unplugin-vue-i18n] `)), ...args);
 }
 function error(...args) {
-  console.error(`[unplugin-vue-i18n] `, ...args);
+  console.error(pc.red(pc.bold(`[unplugin-vue-i18n] `)), ...args);
 }
 async function getRaw(path) {
   return promises.readFile(path, { encoding: "utf-8" });
@@ -84,7 +87,9 @@ function raiseError(message) {
 
 const INTLIFY_BUNDLE_IMPORT_ID = "@intlify/unplugin-vue-i18n/messages";
 const INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID = "@intlify/vite-plugin-vue-i18n/messages";
+const VIRTUAL_PREFIX = "\0";
 const debug = createDebug("unplugin-vue-i18n");
+const installedPkg = checkInstallPackage("@intlify/unplugin-vue-i18n", debug);
 const unplugin = createUnplugin((options = {}, meta) => {
   debug("plugin options:", options, meta.framework);
   if (!["vite", "webpack"].includes(meta.framework)) {
@@ -107,10 +112,16 @@ const unplugin = createUnplugin((options = {}, meta) => {
   debug("bridge", bridge);
   const runtimeOnly = isBoolean(options.runtimeOnly) ? options.runtimeOnly : true;
   debug("runtimeOnly", runtimeOnly);
-  const compositionOnly = isBoolean(options.compositionOnly) ? options.compositionOnly : true;
+  const compositionOnly = installedPkg === "vue-i18n" ? isBoolean(options.compositionOnly) ? options.compositionOnly : true : true;
   debug("compositionOnly", compositionOnly);
-  const fullInstall = isBoolean(options.fullInstall) ? options.fullInstall : true;
+  const fullInstall = installedPkg === "vue-i18n" ? isBoolean(options.fullInstall) ? options.fullInstall : true : false;
   debug("fullInstall", fullInstall);
+  const useVueI18nImportName = options.useVueI18nImportName;
+  if (useVueI18nImportName != null) {
+    warn(`'useVueI18nImportName' option is experimental`);
+  }
+  debug("useVueI18nImportName", useVueI18nImportName);
+  const getAliasName = () => installedPkg === "petite-vue-i18n" && isBoolean(useVueI18nImportName) && useVueI18nImportName ? "vue-i18n" : `${installedPkg}`;
   const esm = isBoolean(options.esm) ? options.esm : true;
   debug("esm", esm);
   let isProduction = false;
@@ -118,39 +129,51 @@ const unplugin = createUnplugin((options = {}, meta) => {
   return {
     name: "unplugin-vue-i18n",
     enforce: meta.framework === "vite" ? "pre" : "post",
-    transformInclude(id) {
-      debug("transformInclude", id);
-      if (meta.framework === "vite") {
-        return true;
-      } else {
-        const { filename } = parseVueRequest(id);
-        return filename.endsWith("vue") || filename.endsWith(INTLIFY_BUNDLE_IMPORT_ID) || filename.endsWith(INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID) ? true : /\.(json5?|ya?ml)$/.test(id) && filter(id);
-      }
-    },
     vite: {
       config(config, { command }) {
         normalizeConfigResolveAlias(config.resolve, meta.framework);
         if (command === "build" && runtimeOnly) {
           if (isArray(config.resolve.alias)) {
             config.resolve.alias.push({
-              find: "vue-i18n",
-              replacement: `vue-i18n/dist/vue-i18n.runtime.esm-bundler.js`
+              find: getAliasName(),
+              replacement: `${installedPkg}/dist/${installedPkg}.runtime.esm-bundler.js`
             });
           } else if (isObject(config.resolve.alias)) {
-            config.resolve.alias["vue-i18n"] = `vue-i18n/dist/vue-i18n.runtime.esm-bundler.js`;
+            config.resolve.alias[getAliasName()] = `${installedPkg}/dist/${installedPkg}.runtime.esm-bundler.js`;
           }
+          debug(`alias name: ${getAliasName()}`);
+          debug(
+            `set ${installedPkg} runtime only: ${installedPkg}/dist/${installedPkg}.runtime.esm-bundler.js`
+          );
+        } else if (command === "serve" && installedPkg === "petite-vue-i18n" && useVueI18nImportName) {
+          normalizeConfigResolveAlias(config.resolve, meta.framework);
+          if (isArray(config.resolve.alias)) {
+            config.resolve.alias.push({
+              find: "vue-i18n",
+              replacement: `petite-vue-i18n/dist/petite-vue-i18n.esm-bundler.js`
+            });
+          } else {
+            config.resolve.alias["vue-i18n"] = `petite-vue-i18n/dist/petite-vue-i18n.esm-bundler.js`;
+          }
+          debug(`alias name: ${getAliasName()}`);
         }
         config.define = config.define || {};
         config.define["__VUE_I18N_LEGACY_API__"] = !compositionOnly;
-        debug(`set __VUE_I18N_LEGACY_API__ is '${config.define["__VUE_I18N_LEGACY_API__"]}'`);
+        debug(
+          `set __VUE_I18N_LEGACY_API__ is '${config.define["__VUE_I18N_LEGACY_API__"]}'`
+        );
         config.define["__VUE_I18N_FULL_INSTALL__"] = fullInstall;
-        debug(`set __VUE_I18N_FULL_INSTALL__ is '${config.define["__VUE_I18N_FULL_INSTALL__"]}'`);
+        debug(
+          `set __VUE_I18N_FULL_INSTALL__ is '${config.define["__VUE_I18N_FULL_INSTALL__"]}'`
+        );
         config.define["__VUE_I18N_PROD_DEVTOOLS__"] = false;
       },
       configResolved(config) {
         isProduction = config.isProduction;
         sourceMap = config.command === "build" ? !!config.build.sourcemap : false;
-        debug(`configResolved: isProduction = ${isProduction}, sourceMap = ${sourceMap}`);
+        debug(
+          `configResolved: isProduction = ${isProduction}, sourceMap = ${sourceMap}`
+        );
         const jsonPlugin = config.plugins.find((p) => p.name === "vite:json");
         if (jsonPlugin) {
           const orgTransform = jsonPlugin.transform;
@@ -178,11 +201,13 @@ const unplugin = createUnplugin((options = {}, meta) => {
       }
       loadWebpack().then((webpack) => {
         if (webpack) {
-          compiler.options.plugins.push(new webpack.DefinePlugin({
-            __VUE_I18N_LEGACY_API__: JSON.stringify(compositionOnly),
-            __VUE_I18N_FULL_INSTALL__: JSON.stringify(fullInstall),
-            __INTLIFY_PROD_DEVTOOLS__: "false"
-          }));
+          compiler.options.plugins.push(
+            new webpack.DefinePlugin({
+              __VUE_I18N_LEGACY_API__: JSON.stringify(compositionOnly),
+              __VUE_I18N_FULL_INSTALL__: JSON.stringify(fullInstall),
+              __INTLIFY_PROD_DEVTOOLS__: "false"
+            })
+          );
           debug(`set __VUE_I18N_LEGACY_API__ is '${compositionOnly}'`);
           debug(`set __VUE_I18N_FULL_INSTALL__ is '${fullInstall}'`);
         } else {
@@ -200,35 +225,55 @@ const unplugin = createUnplugin((options = {}, meta) => {
     resolveId(id, importer) {
       debug("resolveId", id, importer);
       if (id === INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID) {
-        warn(`deprected '${INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID}', you should switch to '${INTLIFY_BUNDLE_IMPORT_ID}'`);
-        return id;
+        warn(
+          `deprected '${INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID}', you should switch to '${INTLIFY_BUNDLE_IMPORT_ID}'`
+        );
+        return asVirtualId(id, meta.framework);
       }
       if (id === INTLIFY_BUNDLE_IMPORT_ID) {
-        return id;
+        return asVirtualId(id, meta.framework);
       }
     },
     async load(id) {
       debug("load", id);
       const { query } = parseVueRequest(id);
-      if ([INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID, INTLIFY_BUNDLE_IMPORT_ID].includes(id) && include) {
+      if ([INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID, INTLIFY_BUNDLE_IMPORT_ID].includes(
+        getVirtualId(id, meta.framework)
+      ) && include) {
         let resourcePaths = [];
         const includePaths = isArray(include) ? include : [include];
         for (const inc of includePaths) {
           resourcePaths = [...resourcePaths, ...await fg(inc)];
         }
-        resourcePaths = resourcePaths.filter((el, pos) => resourcePaths.indexOf(el) === pos);
-        const code = await generateBundleResources(resourcePaths, query, isProduction, {
-          forceStringify,
-          bridge,
-          exportESM: esm,
-          useClassComponent
-        });
+        resourcePaths = resourcePaths.filter(
+          (el, pos) => resourcePaths.indexOf(el) === pos
+        );
+        const code = await generateBundleResources(
+          resourcePaths,
+          query,
+          isProduction,
+          {
+            forceStringify,
+            bridge,
+            exportESM: esm,
+            useClassComponent
+          }
+        );
         return {
           code,
           map: { mappings: "" }
         };
       }
     },
+    transformInclude(id) {
+      debug("transformInclude", id);
+      if (meta.framework === "vite") {
+        return true;
+      } else {
+        const { filename } = parseVueRequest(id);
+        return filename.endsWith("vue") || filename.endsWith(INTLIFY_BUNDLE_IMPORT_ID) || filename.endsWith(INTLIFY_BUNDLE_IMPORT_DEPRECTED_ID) || /\.(json5?|ya?ml)$/.test(filename) && filter(filename);
+      }
+    },
     async transform(code, id) {
       const { filename, query } = parseVueRequest(id);
       debug("transform", id, JSON.stringify(query), filename);
@@ -238,16 +283,26 @@ const unplugin = createUnplugin((options = {}, meta) => {
         if (/\.(json5?|ya?ml)$/.test(id) && filter(id)) {
           langInfo = parse(filename).ext;
           const generate = /\.?json5?/.test(langInfo) ? generateJSON : generateYAML;
-          const parseOptions = getOptions(filename, isProduction, query, sourceMap, {
-            inSourceMap,
-            isGlobal: globalSFCScope,
-            useClassComponent,
-            bridge,
-            exportESM: esm,
-            forceStringify
-          });
+          const parseOptions = getOptions(
+            filename,
+            isProduction,
+            query,
+            sourceMap,
+            {
+              inSourceMap,
+              isGlobal: globalSFCScope,
+              useClassComponent,
+              bridge,
+              exportESM: esm,
+              forceStringify
+            }
+          );
           debug("parseOptions", parseOptions);
-          const { code: generatedCode, map } = generate(code, parseOptions, bridge ? createBridgeCodeGenerator(code, query) : void 0);
+          const { code: generatedCode, map } = generate(
+            code,
+            parseOptions,
+            bridge ? createBridgeCodeGenerator(code, query) : void 0
+          );
           debug("generated code", generatedCode);
           debug("sourcemap", map, sourceMap);
           if (code === generatedCode)
@@ -271,17 +326,33 @@ const unplugin = createUnplugin((options = {}, meta) => {
           }
           debug("langInfo", langInfo);
           const generate = /\.?json5?/.test(langInfo) ? generateJSON : generateYAML;
-          const parseOptions = getOptions(filename, isProduction, query, sourceMap, {
-            inSourceMap,
-            isGlobal: globalSFCScope,
-            useClassComponent,
-            bridge,
-            exportESM: esm,
-            forceStringify
-          });
+          const parseOptions = getOptions(
+            filename,
+            isProduction,
+            query,
+            sourceMap,
+            {
+              inSourceMap,
+              isGlobal: globalSFCScope,
+              useClassComponent,
+              bridge,
+              exportESM: esm,
+              forceStringify
+            }
+          );
           debug("parseOptions", parseOptions);
-          const source = await getCode(code, filename, sourceMap, query, meta.framework);
-          const { code: generatedCode, map } = generate(source, parseOptions, bridge ? createBridgeCodeGenerator(source, query) : void 0);
+          const source = await getCode(
+            code,
+            filename,
+            sourceMap,
+            query,
+            meta.framework
+          );
+          const { code: generatedCode, map } = generate(
+            source,
+            parseOptions,
+            bridge ? createBridgeCodeGenerator(source, query) : void 0
+          );
           debug("generated code", generatedCode);
           debug("sourcemap", map, sourceMap);
           if (code === generatedCode)
@@ -318,7 +389,7 @@ async function loadWebpack() {
   try {
     webpack = await import('webpack').then((m) => m.default || m);
   } catch (e) {
-    console.warn(`[@intlify/unplugin-vue-i18n] webpack not found, please install webpack.`);
+    warn(`webpack not found, please install webpack.`);
   }
   return webpack;
 }
@@ -344,7 +415,11 @@ async function generateBundleResources(resources, query, isProduction, {
         forceStringify
       });
       parseOptions.type = "bare";
-      const { code } = generate(source, parseOptions, bridge ? createBridgeCodeGenerator(source, query) : void 0);
+      const { code } = generate(
+        source,
+        parseOptions,
+        bridge ? createBridgeCodeGenerator(source, query) : void 0
+      );
       debug("generated code", code);
       codes.push(`${JSON.stringify(name)}: ${code}`);
     }
@@ -405,8 +480,20 @@ function getOptions(filename, isProduction, query, sourceMap, {
     onWarn: (msg) => {
       warn(`${filename} ${msg}`);
     },
-    onError: (msg) => {
-      error(`${filename} ${msg}`);
+    onError: (msg, extra) => {
+      const codeFrame = generateCodeFrame(
+        extra?.source || extra?.location?.source || "",
+        extra?.location?.start.column,
+        extra?.location?.end.column
+      );
+      const errMssage = `${msg} (error code: ${extra?.code}) in ${filename}
+  target message: ${extra?.source}
+  target message path: ${extra?.path}
+
+  ${codeFrame}
+`;
+      error(errMssage);
+      throw new Error(errMssage);
     }
   };
   if (isCustomBlock(query)) {
@@ -422,5 +509,11 @@ function getOptions(filename, isProduction, query, sourceMap, {
     });
   }
 }
+function getVirtualId(id, framework = "vite") {
+  return framework === "vite" ? id.startsWith(VIRTUAL_PREFIX) ? id.slice(VIRTUAL_PREFIX.length) : "" : id;
+}
+function asVirtualId(id, framework = "vite") {
+  return framework === "vite" ? VIRTUAL_PREFIX + id : id;
+}
 
 export { unplugin as default, unplugin };

package/lib/types.d.ts

@@ -10,6 +10,7 @@ interface PluginOptions {
     globalSFCScope?: boolean;
     bridge?: boolean;
     useClassComponent?: boolean;
+    useVueI18nImportName?: boolean;
 }
 
 export { PluginOptions, SFCLangFormat };

package/lib/vite.cjs

@@ -12,6 +12,7 @@ require('@vue/compiler-sfc');
 require('json5');
 require('js-yaml');
 require('fs');
+require('picocolors');
 
 const vite = index.unplugin.vite;
 

package/lib/vite.mjs

@@ -10,6 +10,7 @@ import '@vue/compiler-sfc';
 import 'json5';
 import 'js-yaml';
 import 'fs';
+import 'picocolors';
 
 const vite = unplugin.vite;
 

package/lib/webpack.cjs

@@ -12,6 +12,7 @@ require('@vue/compiler-sfc');
 require('json5');
 require('js-yaml');
 require('fs');
+require('picocolors');
 
 const webpack = index.unplugin.webpack;
 

package/lib/webpack.mjs

@@ -10,6 +10,7 @@ import '@vue/compiler-sfc';
 import 'json5';
 import 'js-yaml';
 import 'fs';
+import 'picocolors';
 
 const webpack = unplugin.webpack;
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@intlify/unplugin-vue-i18n",
-  "version": "0.4.0",
+  "version": "0.6.0",
   "description": "unplugin for Vue I18n",
   "author": {
     "name": "kazuya kawaguchi",
@@ -22,7 +22,7 @@
     }
   },
   "dependencies": {
-    "@intlify/bundle-utils": "next",
+    "@intlify/bundle-utils": "^3.1.2",
     "@intlify/shared": "next",
     "@rollup/pluginutils": "^4.2.0",
     "@vue/compiler-sfc": "^3.2.23",
@@ -31,15 +31,16 @@
     "js-yaml": "^4.1.0",
     "json5": "^2.2.0",
     "pathe": "^0.2.0",
+    "picocolors": "^1.0.0",
     "source-map": "0.6.1",
-    "unplugin": "^0.6.2"
+    "unplugin": "^0.8.0"
   },
   "devDependencies": {
     "mlly": "^0.5.2",
-    "unbuild": "^0.7.4"
+    "unbuild": "^0.8.11"
   },
   "engines": {
-    "node": ">= 12"
+    "node": ">= 14.16"
   },
   "files": [
     "lib",