{"id":15263,"library":"vue-cli-plugin-i18n","title":"Vue CLI i18n Plugin","description":"The `vue-cli-plugin-i18n` package is a Vue CLI plugin designed to integrate `vue-i18n` into new or existing Vue projects, streamlining the setup of internationalization. As of version 2.3.2, its latest release in late 2021, the plugin provides scaffolding for `vue-i18n`'s basic configuration, support for locale messages within Single File Components via `vue-i18n-loader`, and experimental reporting features for missing or unused locale keys. It supports both Vue 2 and Vue 3 projects, offering distinct options like `enableInSFC` for Vue 2 (related to `vue-i18n` v8.x) and `enableLegacy` or `runtimeOnly` for Vue 3 (related to `vue-i18n` v9+). Additionally, it includes a `enableBridge` option for Vue 2 projects to facilitate migration to `vue-i18n@v9.x`. The plugin is maintained by the Intlify organization, known for the `vue-i18n` library itself, ensuring close compatibility and up-to-date best practices.","status":"maintenance","version":"2.3.2","language":"javascript","source_language":"en","source_url":"https://github.com/intlify/vue-cli-plugin-i18n","tags":["javascript","plugin","vue","vue-cli","vue-i18n"],"install":[{"cmd":"npm install vue-cli-plugin-i18n","lang":"bash","label":"npm"},{"cmd":"yarn add vue-cli-plugin-i18n","lang":"bash","label":"yarn"},{"cmd":"pnpm add vue-cli-plugin-i18n","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Core internationalization library that this plugin configures.","package":"vue-i18n","optional":false},{"reason":"Required when using Composition API with vue-i18n-bridge in bridge mode for Vue 2 projects.","package":"@vue/composition-api","optional":true}],"imports":[{"note":"For Vue 3 projects, `createI18n` is the standard way to initialize vue-i18n. The plugin scaffolds this setup.","wrong":"import VueI18n from 'vue-i18n'","symbol":"createI18n","correct":"import { createI18n } from 'vue-i18n'"},{"note":"The plugin scaffolds an `i18n.js` or `i18n.ts` file which typically exports the initialized `i18n` instance as a default export.","wrong":"import { i18n } from './i18n'","symbol":"i18n instance","correct":"import i18n from './i18n'"},{"note":"For Vue 3 and Composition API, `useI18n` provides access to i18n functions. The `this.$i18n` approach is for Options API or Vue 2.","wrong":"this.$i18n","symbol":"useI18n","correct":"import { useI18n } from 'vue-i18n'"}],"quickstart":{"code":"vue create my-vue-app\ncd my-vue-app\nvue add i18n\n\n// After installation, a src/i18n.js (or .ts) file will be generated.\n// You can then use it in your main.js (or main.ts):\n// src/main.js\nimport { createApp } from 'vue'\nimport App from './App.vue'\nimport i18n from './i18n' // Auto-generated by the plugin\n\ncreateApp(App).use(i18n).mount('#app')\n\n// To report missing/unused keys (experimental):\n// vue-cli-service i18n:report","lang":"typescript","description":"This demonstrates how to create a new Vue project, add the i18n plugin, and integrate the scaffolded internationalization setup into the main application entry point."},"warnings":[{"fix":"Set `enableLegacy: true` in `vue.config.js` under `pluginOptions.i18n` for legacy API or refactor i18n usage to `createI18n` and `useI18n` with Vue I18n v9+.","message":"When migrating a Vue 2 project to Vue 3, `vue-cli-plugin-i18n` v2.x requires configuring `enableLegacy: true` in `vue.config.js` to use the legacy Vue I18n API or refactoring to the Composition API and `createI18n`.","severity":"breaking","affected_versions":">=2.0.0"},{"fix":"Run `npm install @vue/composition-api` or `yarn add @vue/composition-api` in your project if you enable `enableBridge` and use the Composition API.","message":"Using the `enableBridge` option in Vue 2 to prepare for Vue I18n v9.x migration requires manual installation of `@vue/composition-api` if you intend to use the Composition API.","severity":"gotcha","affected_versions":">=2.2.0"},{"fix":"Ensure your project is Vue 2 and using vue-i18n v8.x when setting `enableInSFC: true` in `vue.config.js`.","message":"The `enableInSFC` option, which allows locale messages in Single File Components, is only supported for Vue 2 projects using Vue I18n v8.x.","severity":"gotcha","affected_versions":">=2.0.0"},{"fix":"Be aware of this limitation; manual review may be necessary for locale messages within custom blocks.","message":"The `vue-cli-service i18n:report` command has limitations and cannot detect missing or unused keys from locale messages defined within i18n custom blocks in Single File Components.","severity":"gotcha","affected_versions":">=2.0.0"},{"fix":"For new Vue 3 projects, consider directly integrating `vue-i18n` using Vite or similar build tools without the CLI plugin, or explore `@intlify/vue-i18n-unplugin` for Vite/Webpack integration.","message":"The `vue-cli-plugin-i18n` is tied to Vue CLI, which is moving towards maintenance mode as newer build tools like Vite gain prominence. While still functional, new Vue projects may favor alternative i18n integration methods.","severity":"deprecated","affected_versions":">=2.0.0"}],"env_vars":null,"last_verified":"2026-04-21T00:00:00.000Z","next_check":"2026-07-20T00:00:00.000Z","problems":[{"fix":"Ensure `runtimeOnly: false` (or omit) if you need the full build, or `runtimeOnly: true` if you intend to use the runtime-only version, configured in `vue.config.js` under `pluginOptions.i18n`.","cause":"Incorrect Vue I18n build chosen for the project context, often related to runtime-only vs. full build.","error":"Error: Failed to resolve entry for package \"vue-i18n\". The package may have an incorrect main/module field."},{"fix":"Verify that `app.use(i18n)` is called in your `main.js` (or `main.ts`) file after creating the Vue app, and that `i18n` is correctly imported from the generated `src/i18n.js`.","cause":"The `i18n` instance was not correctly provided to the Vue application.","error":"[vue-i18n] Not found i18n instance. Please make sure that you install the plugin in the Vue app with `app.use(i18n)`."},{"fix":"Ensure that a locale messages file (e.g., `en.json`) exists in your `localeDir` and contains valid internationalization messages for the `fallbackLocale`.","cause":"The fallback locale specified in `vue.config.js` or `.env` is not present in your locale message files.","error":"[vue-i18n] Fallback locale `en` is not registered. Please register it before use."}],"ecosystem":"npm"}