{"id":22713,"library":"vite-plugin-laravel-translations","title":"vite-plugin-laravel-translations","description":"Vite plugin that retrieves Laravel PHP translation files and makes them available as a global JSON variable (`import.meta.env.VITE_LARAVEL_TRANSLATIONS`) for use with i18n frameworks like vue-i18n or react-i18next. Version 0.3.1 supports Vite 3–6 and Node >=12. It uses Vite-specific hooks (`config`, `handleHotUpdate`) and cannot be used as a Rollup plugin. Key differentiators: automatic PHP-to-JSON conversion, HMR support for translation files, and optional namespacing for React compatibility. Alternative to manual JSON generation or PHP-based solutions like `laravel-vue-i18n`.","status":"active","version":"0.3.1","language":"javascript","source_language":"en","source_url":"https://github.com/dcodegroup/vite-plugin-laravel-translations","tags":["javascript","vite","plugin","vite-plugin","laravel","translations","vue","react","json"],"install":[{"cmd":"npm install vite-plugin-laravel-translations","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-laravel-translations","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-laravel-translations","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency; plugin uses Vite-specific hooks and is incompatible with Rollup.","package":"vite","optional":false}],"imports":[{"note":"The package is ESM-only; CommonJS require() will fail. Use default import.","wrong":"const laravelTranslations = require('vite-plugin-laravel-translations')","symbol":"default (plugin)","correct":"import laravelTranslations from 'vite-plugin-laravel-translations'"},{"note":"When using dynamic import, you must access .default because the module exports default.","wrong":"const laravelTranslations = await import('vite-plugin-laravel-translations')","symbol":"dynamic import (v0.1.5+)","correct":"const laravelTranslations = (await import('vite-plugin-laravel-translations')).default"},{"note":"This is a Vite env variable injected at build time, not a Node.js environment variable. Use import.meta.env.","wrong":"const messages = process.env.VITE_LARAVEL_TRANSLATIONS","symbol":"import.meta.env.VITE_LARAVEL_TRANSLATIONS","correct":"const messages = import.meta.env.VITE_LARAVEL_TRANSLATIONS"}],"quickstart":{"code":"// vite.config.js\nimport { defineConfig } from 'vite';\nimport laravelTranslations from 'vite-plugin-laravel-translations';\n\nexport default defineConfig({\n  plugins: [\n    laravelTranslations({\n      // Include Laravel JSON translation files (e.g., resources/lang/vendor/*.json)\n      includeJson: false,\n      // Namespace for React i18next compatibility (e.g., 'translation')\n      namespace: false,\n    }),\n  ],\n});\n\n// resources/js/app.js (Vue 3 example)\nimport { createApp } from 'vue';\nimport { createI18n } from 'vue-i18n';\n\nconst i18n = createI18n({\n  locale: 'en',\n  fallbackLocale: 'en',\n  messages: import.meta.env.VITE_LARAVEL_TRANSLATIONS,\n});\n\nconst app = createApp({});\napp.use(i18n);\napp.mount('#app');","lang":"javascript","description":"Shows basic Vite plugin setup and Vue 3 i18n integration using the injected env variable."},"warnings":[{"fix":"Use only with Vite. Do not attempt to use with Rollup or other bundlers.","message":"Plugin uses Vite-specific hooks (config & handleHotUpdate) and cannot be used as a Rollup plugin.","severity":"breaking","affected_versions":">=0.0.1-rc.1"},{"fix":"Always use import.meta.env in your application code.","message":"The injected variable is `import.meta.env.VITE_LARAVEL_TRANSLATIONS`, not `process.env.VITE_LARAVEL_TRANSLATIONS`.","severity":"gotcha","affected_versions":">=0.0.1-rc.1"},{"fix":"Use `const laravelTranslations = (await import('vite-plugin-laravel-translations')).default`","message":"Dynamic import in v0.1.5+ requires accessing .default after await import().","severity":"gotcha","affected_versions":">=0.1.5"},{"fix":"Set `includeJson: false` explicitly until future clarification.","message":"The `includeJson` option is marked as 'TBC' (To Be Confirmed) in the README - behavior may change.","severity":"deprecated","affected_versions":"<=0.3.1"},{"fix":"Verify translations are in `resources/lang/{locale}/` or adjust as needed; custom paths not documented.","message":"Plugin indexes PHP files from `resources/lang/` by default. Ensure your Laravel structure matches.","severity":"gotcha","affected_versions":">=0.0.1-rc.1"},{"fix":"Install a compatible vite version (e.g., npm i vite@^5.1.3).","message":"Peer dependency vite is required; install failures may occur if version outside ^3.2.11 || ^4.0.0 || ^5.1.3 || ^6.0.","severity":"breaking","affected_versions":">=0.2.2"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Use ES import syntax: `import laravelTranslations from 'vite-plugin-laravel-translations'`","cause":"Package is ESM-only; CommonJS require() fails.","error":"require() of ES Module /path/to/node_modules/vite-plugin-laravel-translations/index.js not supported."},{"fix":"Ensure the plugin is added to the Vite config and access `import.meta.env.VITE_LARAVEL_TRANSLATIONS` inside your app (not in vite.config.js).","cause":"The env variable is only available after the plugin runs; if accessed before plugin execution or in plain Node scripts.","error":"VITE_LARAVEL_TRANSLATIONS is not defined / undefined"},{"fix":"Run `npm i vite-plugin-laravel-translations` and ensure vite peer dependency is satisfied.","cause":"Package not installed or mismatched peer dependency (vite version).","error":"Cannot find module 'vite-plugin-laravel-translations'"},{"fix":"Use default import: `import laravelTranslations from 'vite-plugin-laravel-translations'`","cause":"Default import not used correctly (e.g., `import * as laravelTranslations`).","error":"Uncaught TypeError: laravelTranslations is not a function"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}