@intlify/unplugin-vue-i18n 5.2.0 → 5.3.1

package/README.md

@@ -4,7 +4,6 @@
 [![Test](https://github.com/intlify/bundle-tools/actions/workflows/test.yml/badge.svg)](https://github.com/intlify/bundle-tools/actions/workflows/test.yml)
 [![npm](https://img.shields.io/npm/v/@intlify/unplugin-vue-i18n.svg?color=yellow)](https://www.npmjs.com/package/@intlify/unplugin-vue-i18n)
 
-
 unplugin for Vue I18n
 
 ## 🌟 Features
@@ -17,7 +16,6 @@ unplugin for Vue I18n
   - Locale of i18n resource definition for global scope
   - i18n resource formatting
 
-
 ## 💿 Installation
 
 ```sh
@@ -33,8 +31,10 @@ import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite'
 
 export default defineConfig({
   plugins: [
-    VueI18nPlugin({ /* options */ }),
-  ],
+    VueI18nPlugin({
+      /* options */
+    })
+  ]
 })
 ```
 
@@ -50,7 +50,9 @@ const VueI18nPlugin = require('@intlify/unplugin-vue-i18n/webpack')
 module.exports = {
   /* ... */
   plugins: [
-    VueI18nPlugin({ /* options */ })
+    VueI18nPlugin({
+      /* options */
+    })
   ]
 }
 ```
@@ -68,14 +70,18 @@ import VueI18nPlugin from '@intlify/unplugin-vue-i18n'
 export default defineNuxtConfig({
   vite: {
     plugins: [
-      VueI18nPlugin.vite({ /* options */ }),
-    ],
+      VueI18nPlugin.vite({
+        /* options */
+      })
+    ]
   },
   // When using Webpack
   // builder: '@nuxt/webpack-builder',
   webpack: {
     plugins: [
-      VueI18nPlugin.webpack({ /* options */ }),
+      VueI18nPlugin.webpack({
+        /* options */
+      })
     ]
   }
 })
@@ -212,6 +218,7 @@ app.use(i18n).mount('#app')
 ```
 
 Change your vite.config.ts file accordingly to import all the files from locales folder on the root. Change `'./src/locales/**'` to path of your locales.
+
 ```ts
 // vite.config.ts
 import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite'
@@ -220,11 +227,12 @@ import path from 'path'
 export default defineConfig({
   plugins: [
     VueI18nPlugin({
-      include: [path.resolve(__dirname, './src/locales/**')],
-    }),
-  ],
+      include: [path.resolve(__dirname, './src/locales/**')]
+    })
+  ]
 })
 ```
+
 unplugin-vue-i18n will automatically merge locale files into `@intlify/unplugin-vue-i18n/messages`. This allows locales to be split across multiple files, for example `src/locales/fruits/en.json` and `src/locales/vegetables/en.json`.
 
 ### Types
@@ -239,7 +247,6 @@ If you want type definition of `@intlify/unplugin-vue-i18n/messages`, add `unplu
 }
 ```
 
-
 ## 📦 Automatic bundling
 
 ### For Vue I18n
@@ -253,7 +260,6 @@ 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)
 
-
 ## 🔧 Options
 
 ### `include`
@@ -274,26 +280,23 @@ About details, See the [here](https://vue-i18n.intlify.dev/guide/advanced/optimi
 
   If nothing is specified for this option, i.e. `undefined`, nothing is done to the resource in the above format.
 
-> [!WARNING]
-  `json` resources matches this option, it will be handled **before the internal json plugin of bundler, and will not be processed afterwards**, else the option doesn't match, the bundler side will handle.
+> [!WARNING] > `json` resources matches this option, it will be handled **before the internal json plugin of bundler, and will not be processed afterwards**, else the option doesn't match, the bundler side will handle.
 
-> [!WARNING]
-  `yaml` resources don't support multi documentation with `|`, alias with `&` and `*`, tags with `! `, `@`, etc. Only simple data structures.
+> [!WARNING] > `yaml` resources don't support multi documentation with `|`, alias with `&` and `*`, tags with `! `, `@`, etc. Only simple data structures.
 
-> [!WARNING]
-  `js` and `ts` resources are set **simple export (`export default`) as locale messages object, as default**.
+> [!WARNING] > `js` and `ts` resources are set **simple export (`export default`) as locale messages object, as default**.
 
-  ```js
-  export default {
-    hello: 'Hello, {name}!',
-    // ...
-  }
-  ```
+```js
+export default {
+  hello: 'Hello, {name}!'
+  // ...
+}
+```
 
-  If you need to use programmatically dynamic resource construction, you would be enable `allowDynamic` option. about details, see the section.
+If you need to use programmatically dynamic resource construction, you would be enable `allowDynamic` option. about details, see the section.
 
 > [!WARNING]
-  If you use the `js` and `ts` resources formats, set the paths, so your application code is not targeted. We recommend that resources be isolated from the application code.
+> If you use the `js` and `ts` resources formats, set the paths, so your application code is not targeted. We recommend that resources be isolated from the application code.
 
 ### `module`
 
@@ -301,7 +304,7 @@ About details, See the [here](https://vue-i18n.intlify.dev/guide/advanced/optimi
 - **Default:** `'vue-i18n'`
 
   > [!NOTE]
-  This options is supported from v5.1.0, and works with vue-i18n v10 and later.
+  > This options is supported from v5.1.0, and works with vue-i18n v10 and later.
 
   Bundle target vue-i18n module. You can specify either `‘vue-i18n’` or `‘petite-vue-i18n’`.
 
@@ -330,7 +333,6 @@ About details, See the [here](https://vue-i18n.intlify.dev/guide/advanced/optimi
 
   In that case, we recommend setting the `escapeHtml` option to `true`.
 
-
 ### `escapeHtml`
 
 - **Type:** `boolean`
@@ -340,7 +342,6 @@ About details, See the [here](https://vue-i18n.intlify.dev/guide/advanced/optimi
 
   If `strictMessage` is disabled by `false`, we recommend this option be enabled.
 
-
 ### `allowDynamic`
 
 - **Type:** `boolean`
@@ -367,17 +368,17 @@ About details, See the [here](https://vue-i18n.intlify.dev/guide/advanced/optimi
 - **Default:** `true`
 
 > [!IMPORTANT]
-  'jitCompilation' option is deprected in v5.
-  This option will be supported with vue-i18n until v9 latest version.
+> 'jitCompilation' option is deprected in v5.
+> This option will be supported with vue-i18n until v9 latest version.
 
-  Whether locale mesages should be compiled by JIT (Just in Time) compilation with vue-i18n's message compiler.
+Whether locale mesages should be compiled by JIT (Just in Time) compilation with vue-i18n's message compiler.
 
-  JIT compilation has been supported since vue-i18n v9.3. This means that since v9 was released until now, the message compiler compiles to executable JavaScript code, however it did not work in the CSP environment. Also, since this was an AOT (Ahead of Time) compilation, it was not possible to dynamically retrieve locale messages from the back-end Database and compose locale mesages with programatic.
+JIT compilation has been supported since vue-i18n v9.3. This means that since v9 was released until now, the message compiler compiles to executable JavaScript code, however it did not work in the CSP environment. Also, since this was an AOT (Ahead of Time) compilation, it was not possible to dynamically retrieve locale messages from the back-end Database and compose locale mesages with programatic.
 
 > [!WARNING]
-  Enabling JIT compilation causes the message compiler to generate AST objects for locale mesages instead of JavaScript code. If you pre-compile locale messages with a tool such as the [Intlify CLI](https://github.com/intlify/cli) and import them dynamically, you need to rebuild that resource.
+> Enabling JIT compilation causes the message compiler to generate AST objects for locale mesages instead of JavaScript code. If you pre-compile locale messages with a tool such as the [Intlify CLI](https://github.com/intlify/cli) and import them dynamically, you need to rebuild that resource.
 
-  About JIT compilation, See [here](https://vue-i18n.intlify.dev/guide/advanced/optimization.html#jit-compilation)
+About JIT compilation, See [here](https://vue-i18n.intlify.dev/guide/advanced/optimization.html#jit-compilation)
 
 ### `dropMessageCompiler`
 
@@ -392,10 +393,10 @@ If do you will use this option, you need to enable `jitCompilation` option.
 > After v5 or later, this option can be set with or without `jitCompilation`.
 
 > [!NOTE]
-  This option works with vue-i18n v9.3 and later.
+> This option works with vue-i18n v9.3 and later.
 
 > [!WARNING]
-  If you enable this option, **you should check resources in your application are pre-compiled with this plugin.** If you will be loading resources dynamically from the back-end via the API, enabling this option do not work because there is not message compiler.
+> If you enable this option, **you should check resources in your application are pre-compiled with this plugin.** If you will be loading resources dynamically from the back-end via the API, enabling this option do not work because there is not message compiler.
 
 ### `ssr`
 
@@ -405,7 +406,7 @@ If do you will use this option, you need to enable `jitCompilation` option.
   Whether to bundle vue-i18n module for SSR at build time
 
 > [!NOTE]
-  This option works with vue-i18n v9.4 and later.
+> This option works with vue-i18n v9.4 and later.
 
 ### `runtimeOnly`
 
@@ -465,10 +466,38 @@ If do you will use this option, you need to enable `jitCompilation` option.
 
   ```js
   export default {
-    "trueValue": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["true"])};fn.source="true";return fn;})(),
-    "falseValue": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["false"])};fn.source="false";return fn;})(),
-    "nullValue": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["null"])};fn.source="null";return fn;})(),
-    "numberValue": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["1"])};fn.source="1";return fn;})()
+    trueValue: (() => {
+      const fn = ctx => {
+        const { normalize: _normalize } = ctx
+        return _normalize(['true'])
+      }
+      fn.source = 'true'
+      return fn
+    })(),
+    falseValue: (() => {
+      const fn = ctx => {
+        const { normalize: _normalize } = ctx
+        return _normalize(['false'])
+      }
+      fn.source = 'false'
+      return fn
+    })(),
+    nullValue: (() => {
+      const fn = ctx => {
+        const { normalize: _normalize } = ctx
+        return _normalize(['null'])
+      }
+      fn.source = 'null'
+      return fn
+    })(),
+    numberValue: (() => {
+      const fn = ctx => {
+        const { normalize: _normalize } = ctx
+        return _normalize(['1'])
+      }
+      fn.source = '1'
+      return fn
+    })()
   }
   ```
 
@@ -491,6 +520,8 @@ If do you will use this option, you need to enable `jitCompilation` option.
   On inlined `i18n` custom blocks that have specified the `lang` attribute, the `defaultSFCLang` is not applied.
 
   For example, with `defaultSFCLang: "yaml"` or `defaultSFCLang: "yml"`, this custom block:
+
+  <!-- prettier-ignore -->
   ```html
   <i18n lang="yaml">
   en:
@@ -501,6 +532,8 @@ If do you will use this option, you need to enable `jitCompilation` option.
   ```
 
   and this another one, are equivalent:
+
+  <!-- prettier-ignore -->
   ```html
   <i18n>
   en:
@@ -523,6 +556,7 @@ If do you will use this option, you need to enable `jitCompilation` option.
 
   For example, with `globalSFCScope: true`, this custom block:
 
+  <!-- prettier-ignore -->
   ```html
   <i18n lang="yaml" global>
   en:
@@ -534,6 +568,7 @@ If do you will use this option, you need to enable `jitCompilation` option.
 
   and this another one, are equivalent:
 
+  <!-- prettier-ignore -->
   ```html
   <i18n lang="yaml">
   en:
@@ -545,8 +580,9 @@ If do you will use this option, you need to enable `jitCompilation` option.
 
   You can also use `defaultSFCLang: "yaml"`, following with previous example, this another is also equivalent to previous ones:
 
+  <!-- prettier-ignore -->
   ```html
-  <i18n>
+   <i18n>
   en:
     hello: Hello
   es:
@@ -561,9 +597,8 @@ If do you will use this option, you need to enable `jitCompilation` option.
 
   This option that to use i18n custom blocks in `vue-class-component`.
 
-  > [!IMPORTANT]
-  `useClassComponent` option is deprecated in v5.
-  This option will be supported with vue-i18n until v9 latest version.
+  > [!IMPORTANT] > `useClassComponent` option is deprecated in v5.
+  > This option will be supported with vue-i18n until v9 latest version.
 
 ### `onlyLocales`
 
@@ -581,9 +616,8 @@ If do you will use this option, you need to enable `jitCompilation` option.
 
   This option allows a smooth migration from `petite-vue-i18n` to `vue-i18n` and allows progressive enhacement.
 
-  > [!IMPORTANT]
-  `useVueI18nImportName` option is deprecated in v5.
-  This option will be supported with vue-i18n until v9 latest version.
+  > [!IMPORTANT] > `useVueI18nImportName` option is deprecated in v5.
+  > This option will be supported with vue-i18n until v9 latest version.
 
 ### `optimizeTranslationDirective`
 
@@ -595,7 +629,7 @@ If do you will use this option, you need to enable `jitCompilation` option.
   If you want to put it manually, you can specify the signature of the translation function as a string or a string array.
 
   > [!WARNING]
-  About for manually signature, see the details [vue-i18n-extensions API docs](https://github.com/intlify/vue-i18n-extensions/blob/next/docs/%40intlify/vue-i18n-extensions-api.md#translationsignatures) and [usecase from vue-i18n-extensions PR](https://github.com/intlify/vue-i18n-extensions/pull/217/files#diff-3fb9543f91e011d4b0dc9beff44082fe1a99c9eab70c1afab23c3c34352b7c38R121-R200)
+  > About for manually signature, see the details [vue-i18n-extensions API docs](https://github.com/intlify/vue-i18n-extensions/blob/next/docs/%40intlify/vue-i18n-extensions-api.md#translationsignatures) and [usecase from vue-i18n-extensions PR](https://github.com/intlify/vue-i18n-extensions/pull/217/files#diff-3fb9543f91e011d4b0dc9beff44082fe1a99c9eab70c1afab23c3c34352b7c38R121-R200)
 
 ### `transformI18nBlock`
 
@@ -605,6 +639,7 @@ If do you will use this option, you need to enable `jitCompilation` option.
   This hook allows a user to modify the `<i18n>` block before the plugin generates the translations. The hook is passed the source of the `<ii8n>` block as a `string` after the SFC is read from disk.
 
   **Plugin**
+
   ```javascript
   function transformI18nBlock(source) {
     // transformation logic
@@ -617,32 +652,37 @@ If do you will use this option, you need to enable `jitCompilation` option.
   ```
 
   **Before**
+
+  <!-- prettier-ignore -->
   ```html
   <i18n>
   [
-      'slug-one',
-      'slug-two'
+    'slug-one',
+    'slug-two'
   ]
-  <i18n>
+  </i18n>
   ```
 
   **After**
+
+  <!-- prettier-ignore -->
   ```html
   <i18n>
   {
-      'en': {
-        'slug-one': 'foo',
-        'slug-two': 'bar'
-      },
-      ja: {
-        'slug-one': 'foo',
-        'slug-two': 'bar'
-      }
+    'en': {
+      'slug-one': 'foo',
+      'slug-two': 'bar'
+    },
+    ja: {
+      'slug-one': 'foo',
+      'slug-two': 'bar'
+    }
   }
   </i18n>
   ```
+
   > [!IMPORTANT]
-  The function **must** return a string or the build will fail.
+  > The function **must** return a string or the build will fail.
 
 ## 📜 Changelog
 

package/lib/index.cjs

@@ -8,10 +8,10 @@ const pc = require('picocolors');
 const path = require('node:path');
 const pathe = require('pathe');
 const shared = require('@intlify/shared');
+const bundleUtils = require('@intlify/bundle-utils');
+const pluginutils = require('@rollup/pluginutils');
 const fg = require('fast-glob');
 const node_fs = require('node:fs');
-const pluginutils = require('@rollup/pluginutils');
-const bundleUtils = require('@intlify/bundle-utils');
 const compilerSfc = require('vue/compiler-sfc');
 const vueI18nExtensions = require('@intlify/vue-i18n-extensions');
 const scopeManager = require('@typescript-eslint/scope-manager');
@@ -383,7 +383,6 @@ function resourcePlugin({
         return asVirtualId(id, meta.framework);
       }
     },
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     async load(id) {
       debug$2("load", id);
       if (INTLIFY_BUNDLE_IMPORT_ID === getVirtualId(id, meta.framework) && include) {
@@ -539,7 +538,7 @@ async function loadWebpack() {
   let webpack = null;
   try {
     webpack = await import('webpack').then((m) => m.default || m);
-  } catch (e) {
+  } catch (_e) {
     warn(`webpack not found, please install webpack.`);
   }
   return webpack;
@@ -704,6 +703,7 @@ function directivePlugin({
 }) {
   let vuePlugin = null;
   let vuePluginOptions = null;
+  const excludeLangs = ["pug", "jsx", "tsx"];
   return {
     name: resolveNamespace("directive"),
     enforce: "pre",
@@ -730,18 +730,23 @@ function directivePlugin({
       }
     },
     async transform(code, id) {
-      const { filename } = parseVueRequest(id);
-      if (vuePluginOptions == null) {
-        vuePluginOptions = getVuePluginOptions(vuePlugin);
-      }
       if (id.endsWith(".vue")) {
-        analyzeIdentifiers(
-          getDescriptor(filename, code, vuePluginOptions),
-          vuePluginOptions,
-          translationIdentifiers
-        );
+        const { filename, query } = parseVueRequest(id);
+        if (!excludeLangs.includes(query.lang ?? "")) {
+          if (vuePluginOptions == null) {
+            vuePluginOptions = getVuePluginOptions(vuePlugin);
+          }
+          analyzeIdentifiers(
+            getDescriptor(filename, code, vuePluginOptions),
+            vuePluginOptions,
+            translationIdentifiers
+          );
+        }
       }
-      return code;
+      return {
+        code,
+        map: { version: 3, mappings: "", sources: [] }
+      };
     }
   };
 }

package/lib/index.mjs

@@ -4,10 +4,10 @@ import pc from 'picocolors';
 import path from 'node:path';
 import { normalize, parse } from 'pathe';
 import { isArray, isString, isBoolean, assign, isNumber, isEmptyObject, generateCodeFrame } from '@intlify/shared';
+import { generateJSON, generateYAML, generateJavaScript } from '@intlify/bundle-utils';
+import { createFilter } from '@rollup/pluginutils';
 import fg from 'fast-glob';
 import { promises } from 'node:fs';
-import { createFilter } from '@rollup/pluginutils';
-import { generateJSON, generateYAML, generateJavaScript } from '@intlify/bundle-utils';
 import { parse as parse$1 } from 'vue/compiler-sfc';
 import { transformVTDirective } from '@intlify/vue-i18n-extensions';
 import { analyze } from '@typescript-eslint/scope-manager';
@@ -371,7 +371,6 @@ function resourcePlugin({
         return asVirtualId(id, meta.framework);
       }
     },
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
     async load(id) {
       debug$2("load", id);
       if (INTLIFY_BUNDLE_IMPORT_ID === getVirtualId(id, meta.framework) && include) {
@@ -527,7 +526,7 @@ async function loadWebpack() {
   let webpack = null;
   try {
     webpack = await import('webpack').then((m) => m.default || m);
-  } catch (e) {
+  } catch (_e) {
     warn(`webpack not found, please install webpack.`);
   }
   return webpack;
@@ -692,6 +691,7 @@ function directivePlugin({
 }) {
   let vuePlugin = null;
   let vuePluginOptions = null;
+  const excludeLangs = ["pug", "jsx", "tsx"];
   return {
     name: resolveNamespace("directive"),
     enforce: "pre",
@@ -718,18 +718,23 @@ function directivePlugin({
       }
     },
     async transform(code, id) {
-      const { filename } = parseVueRequest(id);
-      if (vuePluginOptions == null) {
-        vuePluginOptions = getVuePluginOptions(vuePlugin);
-      }
       if (id.endsWith(".vue")) {
-        analyzeIdentifiers(
-          getDescriptor(filename, code, vuePluginOptions),
-          vuePluginOptions,
-          translationIdentifiers
-        );
+        const { filename, query } = parseVueRequest(id);
+        if (!excludeLangs.includes(query.lang ?? "")) {
+          if (vuePluginOptions == null) {
+            vuePluginOptions = getVuePluginOptions(vuePlugin);
+          }
+          analyzeIdentifiers(
+            getDescriptor(filename, code, vuePluginOptions),
+            vuePluginOptions,
+            translationIdentifiers
+          );
+        }
       }
-      return code;
+      return {
+        code,
+        map: { version: 3, mappings: "", sources: [] }
+      };
     }
   };
 }

package/lib/vite.cjs

@@ -7,10 +7,10 @@ require('picocolors');
 require('node:path');
 require('pathe');
 require('@intlify/shared');
+require('@intlify/bundle-utils');
+require('@rollup/pluginutils');
 require('fast-glob');
 require('node:fs');
-require('@rollup/pluginutils');
-require('@intlify/bundle-utils');
 require('vue/compiler-sfc');
 require('@intlify/vue-i18n-extensions');
 require('@typescript-eslint/scope-manager');

package/lib/vite.mjs

@@ -5,10 +5,10 @@ import 'picocolors';
 import 'node:path';
 import 'pathe';
 import '@intlify/shared';
+import '@intlify/bundle-utils';
+import '@rollup/pluginutils';
 import 'fast-glob';
 import 'node:fs';
-import '@rollup/pluginutils';
-import '@intlify/bundle-utils';
 import 'vue/compiler-sfc';
 import '@intlify/vue-i18n-extensions';
 import '@typescript-eslint/scope-manager';

package/lib/webpack.cjs

@@ -7,10 +7,10 @@ require('picocolors');
 require('node:path');
 require('pathe');
 require('@intlify/shared');
+require('@intlify/bundle-utils');
+require('@rollup/pluginutils');
 require('fast-glob');
 require('node:fs');
-require('@rollup/pluginutils');
-require('@intlify/bundle-utils');
 require('vue/compiler-sfc');
 require('@intlify/vue-i18n-extensions');
 require('@typescript-eslint/scope-manager');

package/lib/webpack.mjs

@@ -5,10 +5,10 @@ import 'picocolors';
 import 'node:path';
 import 'pathe';
 import '@intlify/shared';
+import '@intlify/bundle-utils';
+import '@rollup/pluginutils';
 import 'fast-glob';
 import 'node:fs';
-import '@rollup/pluginutils';
-import '@intlify/bundle-utils';
 import 'vue/compiler-sfc';
 import '@intlify/vue-i18n-extensions';
 import '@typescript-eslint/scope-manager';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@intlify/unplugin-vue-i18n",
-  "version": "5.2.0",
+  "version": "5.3.1",
   "description": "unplugin for Vue I18n",
   "author": {
     "name": "kazuya kawaguchi",
@@ -24,12 +24,12 @@
   },
   "dependencies": {
     "@eslint-community/eslint-utils": "^4.4.0",
-    "@intlify/bundle-utils": "^9.0.0-beta.0",
-    "@intlify/shared": "next",
+    "@intlify/bundle-utils": "^9.0.0",
+    "@intlify/shared": "latest",
     "@intlify/vue-i18n-extensions": "^7.0.0",
     "@rollup/pluginutils": "^5.1.0",
-    "@typescript-eslint/scope-manager": "^7.13.0",
-    "@typescript-eslint/typescript-estree": "^7.13.0",
+    "@typescript-eslint/scope-manager": "^8.13.0",
+    "@typescript-eslint/typescript-estree": "^8.13.0",
     "debug": "^4.3.3",
     "fast-glob": "^3.2.12",
     "js-yaml": "^4.1.0",