vite-plugin-typed-i18next-loader

This plugin will generate a virtual module that exports the compiled resources for i18next and will also generate a type definition file for the resources.

Majority of the code for this plugin is from alienfast/vite-plugin-i18next-loader.

Install

npm install --save-dev vite-plugin-typed-i18next-loader

# or
pnpm add -D vite-plugin-typed-i18next-loader

# or
yarn add -D vite-plugin-typed-i18next-loader

Options

Name	Type	Default	Description
defaultLocale	string	'en'	The default locale the plugin will generate the type from.
defaultNamespace	string	'translation'	The default i18next namespace the plugin will use.
include	('**/*.json' | '**/*.yml' | '**/*.yaml')[]	['**/*.json', '**/*.yml', '**/*.yaml']	Glob patterns of files to include for bundling.
namespaceResolution	basename, relativePath	none	Namespace resolution strategy.
dtsOutputFile	string	'./src/types/i18next.d.ts'	Output file destination for the generated types.
virtualModuleDtsOutputFile	string	'./src/types/i18next-virtual.d.ts'	Output file destination for the generated virtual module types.
paths	string[]	[]	Locale top-level directory paths.
dts	{ expand: boolean }	{ expand: true }	DTS generation options.

Usage with Vite

import i18nextPlugin from 'vite-plugin-typed-i18next-loader';
import { defineConfig } from 'vite';

export default defineConfig({
  plugins: [
    i18nextPlugin({
      defaultLocale: 'en-GB',
      defaultNamespace: 'translation',
      paths: ['./src/locales/'],
      namespaceResolution: 'basename',
      dtsOutputFile: './src/types/i18next.d.ts',
      virtualModuleDtsOutputFile: './src/types/i18next-virtual.d.ts',
    }),
  ],
});

Usage with i18next

import resources from 'virtual:i18next-typed-loader';
import i18n from 'i18next';

i18n.init({
  defaultNS: 'translation',
  resources: resources,
  ns: ['translation'],
});

Example

// locales/en/translation.json
{
  "application": {
    "title": "My Application",
    "description": "This is my application"
  },
  "common": {
    "items_zero": "No items",
    "items_one": "{{count}} item",
    "items_other": "{{count}} items",
    "rank_one": "{{count}}st",
    "rank_two": "{{count}}nd",
    "rank_few": "{{count}}rd",
    "rank_other": "{{count}}th"
  }
}

// src/types/i18next.d.ts
import 'i18next';

type GeneratedResource = {
  translation: {
    'application.title': string;
    'application.description': string;
    'common.items': string;
    'common.rank': string;
  };
};

type FlatGeneratedResources<TResource, NS extends keyof TResource> = {
  [Property in keyof TResource[NS] as `${NS & string}:${Property & string}`]: TResource[NS][Property];
};

declare module 'i18next' {
  interface CustomTypeOptions {
    defaultNS: 'translation';
    resources: GeneratedResources & {
      translation: FlatGeneratedResources<GeneratedResources, 'translation'>;
    };
  }
}

LICENSE

MIT