Skip to content

Commit

Permalink
Merge branch 'vite-support'
Browse files Browse the repository at this point in the history
# Conflicts:
#	README.md
#	yarn.lock
  • Loading branch information
felixmosh committed Sep 12, 2023
2 parents c7f5422 + 4ba4aa2 commit e863931
Show file tree
Hide file tree
Showing 38 changed files with 2,026 additions and 1,129 deletions.
9 changes: 9 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,19 @@ All notable changes to this project will be documented in this file. Dates are d

Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).

#### [v3.0.0](https://github.com/felixmosh/i18next-hmr/compare/v2.0.1...v3.0.0)

- Bump deps [`0b74d59`](https://github.com/felixmosh/i18next-hmr/commit/0b74d595a0fabf128767a33be776301f311bba84)
- Add Vite tests [`62afadd`](https://github.com/felixmosh/i18next-hmr/commit/62afaddb2a24b9f848a858df45de8d6488c2136e)
- Initial support for Vite [`d86229f`](https://github.com/felixmosh/i18next-hmr/commit/d86229faa5a879d290ba7bae872cd2644f8e3cbb)

#### [v2.0.1](https://github.com/felixmosh/i18next-hmr/compare/v2.0.0...v2.0.1)

> 22 May 2023
- fix: make d.ts files express the correct type [`92d0b19`](https://github.com/felixmosh/i18next-hmr/commit/92d0b19addcc7220c04f3e7bb28180013d9d58fe)
- fix: ignore if passed an empty i18n instance [`7221a35`](https://github.com/felixmosh/i18next-hmr/commit/7221a3528c7771751b1ecf0988338114495093dd)
- Release 2.0.1 [`4bff183`](https://github.com/felixmosh/i18next-hmr/commit/4bff183bb3037be2d193b0f677b91d661dcbb6de)

### [v2.0.0](https://github.com/felixmosh/i18next-hmr/compare/v1.11.4...v2.0.0)

Expand Down
20 changes: 13 additions & 7 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,13 @@
[![npm](https://img.shields.io/npm/v/i18next-hmr.svg)](https://www.npmjs.com/package/i18next-hmr)
![CI](https://github.com/felixmosh/i18next-hmr/workflows/CI/badge.svg)

I18Next HMR🔥 webpack plugin that allows reloading translation resources on the client & the server
I18Next HMR🔥 webpack / vite plugin that allows reload translation resources instantly on the client & the server.

## Requirements

- Node.js v10 or above
- Webpack 4.x - 5.x
- Webpack v4.x - v5.x
- Vite v3


## Installation
Expand Down Expand Up @@ -51,9 +52,14 @@ const { HMRPlugin } = require('i18next-hmr/plugin');
const instance = i18next.use(Backend); // http-backend is required for client side reloading

if (process.env.NODE_ENV !== 'production') {
instance.use(new HMRPlugin({
client: typeof window !== 'undefined', // enables client side HMR
server: typeof window === 'undefined' // enables server side HMR
instance.use(new HMRPlugin({
webpack: {
client: typeof window !== 'undefined', // enables client side HMR in webpack
server: typeof window === 'undefined' // enables server side HMR in webpack
},
vite: {
client: typeof window !== 'undefined', // enables client side HMR in Vite
}
}));
}

Expand All @@ -69,7 +75,7 @@ Start the app with `NODE_ENV=development`

### Server side

The lib will trigger [`i18n.reloadResources([lang], [ns])`](https://www.i18next.com/overview/api#reloadresources) on the server side with `lang` & `namespace` extracted from the translation filename that was changed.
This lib will trigger [`i18n.reloadResources([lang], [ns])`](https://www.i18next.com/overview/api#reloadresources) on the server side with `lang` & `namespace` extracted from the translation filename that was changed.

⚠️ If your server side is bundled using Webpack, the lib will use the native HMR (if enabled), for it to work properly the lib must be **bundled**, therefore, you should specify the lib as not [external](https://webpack.js.org/configuration/externals/).
There are 2 ways to do that:
Expand All @@ -86,7 +92,7 @@ There are 2 ways to do that:

### Client side

The lib will invoke Webpack's HMR to update client side, that will re-fetch (with cache killer) the updated translation files and trigger [`i18n.changelanguage(lang)`](https://www.i18next.com/overview/api#changelanguage) to trigger listeners (which in React apps it will update the UI).
The lib will invoke Webpack's / Vite HMR to update client side, that will re-fetch (with cache killer) the updated translation files and trigger [`i18n.changelanguage(lang)`](https://www.i18next.com/overview/api#changelanguage) to trigger listeners (which in React apps it will update the UI).

## Example

Expand Down
4 changes: 3 additions & 1 deletion __tests__/utils/preprocessor.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,9 @@
module.exports = {
process(src, path) {
return {
code: src.replace(/module\.hot/g, 'global.mockModule.hot'),
code: src
.replace(/module\.hot/g, 'global.mockModule.hot')
.replace(/import\.meta\.hot/g, 'global.mockImport.meta.hot'),
};
},
};
Loading

0 comments on commit e863931

Please sign in to comment.