https://github.com/yfwz100/vite-plugin-vue2-i18n

The missing vite plugin of vue-i18n for Vue 2.
https://github.com/yfwz100/vite-plugin-vue2-i18n

vite vite-plugin-vue2 vue-i18n vue2

Last synced: 3 months ago
JSON representation

The missing vite plugin of vue-i18n for Vue 2.

• Host: GitHub
• URL: https://github.com/yfwz100/vite-plugin-vue2-i18n
• Owner: yfwz100
• Created: 2021-04-18T14:24:50.000Z (almost 4 years ago)
• Default Branch: master
• Last Pushed: 2022-12-17T15:02:20.000Z (about 2 years ago)
• Last Synced: 2024-10-13T08:57:02.072Z (4 months ago)
• Topics: vite, vite-plugin-vue2, vue-i18n, vue2
• Language: TypeScript
• Homepage:
• Size: 57.6 KB
• Stars: 6
• Watchers: 2
• Forks: 4
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

README

        
# @yfwz100/vite-plugin-vue2-i18n

The missing vue 2 SFC version of vite plugin for vue-i18n, inspired by [the rollup one](https://github.com/intlify/rollup-plugin-vue-i18n/tree/master).

## Requirement

You need to install the follwoing:

- [vite-plugin-vue2][]@1.4.4 or later

- vite 2 or later

## Installation

npm:

```sh

$ npm i --save-dev @rollup/plugin-json

$ npm i --save-dev @rollup/plugin-yaml # if you use locale messages with YAML format

$ npm i --save-dev @yfwz100/vite-plugin-vue2-i18n

```

## Usages

Say we have configured the vite via `vite.config.js` and have a sample index.html (see the [vite guide](https://vitejs.dev/guide/)):

```js

import { defineConfig } from 'vite';

import { createVuePlugin } from '@yfwz100/vite-plugin-vue2';

import { createI18nPlugin } from '@yfwz100/vite-plugin-vue2-i18n';

export default defineConfig({

  plugins: [createVuePlugin(), createI18nPlugin()],

});

```

Then, we can write the i18n blocks in the vue component file:

```vue

  
{{ $t('hello') }}


{

  "en": {

    "hello": "Hello World!"

  },

  "zh": {

    "hello": "你好，世界！"

  }

}

```

Finally, just run `vite` and see the component with i18n enabled.

### Locale Messages Format

We have tested the following formats:

- json (default)

- yaml (via [@rollup/plugin-yaml](https://www.npmjs.com/package/@rollup/plugin-yaml))

See more in the `playground` folder.

## Changelog

See [CHANGELOG.md](https://github.com/yfwz100/vite-plugin-vue2-i18n/blob/master/CHANGELOG.md).

[vite-plugin-vue2]: https://www.npmjs.com/package/vite-plugin-vue2 'the original vite-plugin-vue2'