Skip to content
Resourge

Vite Plugin

viteTranslationPlugin

Section titled “viteTranslationPlugin”

viteTranslationPlugin is designed to enhance Vite applications by optimizing translation loading for production. It provides seamless integration for custom translations and ensures efficient handling of translation files.

Usage

Section titled “Usage”

To use the viteTranslationPlugin, add it to your Vite configuration file (vite.config.ts):

import { viteTranslationPlugin } from '@resourge/translations';


export default {
  plugins: [
    viteTranslationPlugin()
  ]
};

Production-Optimized Translations

Section titled “Production-Optimized Translations”

When you build your Vite application for production (npm run build or yarn build), the viteTranslationPlugin will automatically:

  • Split translations into separate files per language.
  • Load only the necessary language files on demand.
  • Reduce initial bundle size and improve load times.

Other Plugins in @resourge/translations

Section titled “Other Plugins in @resourge/translations”

htmlLanguage

Section titled “htmlLanguage”

Automatically sets and updates the HTML <html lang=""> attribute according to the current language for accessibility and styling.

languageLocalStorage

Section titled “languageLocalStorage”

Stores and retrieves the selected language in the browser’s local storage to persist language choice across sessions.

Section titled “navigatorLanguageDetector”

Detects the user’s preferred language from their browser settings and applies it if supported.

Contributing

Section titled “Contributing”

Contributions to @resourge/translations are welcome! Please see the contributing guidelines.