首页
前端开发
Webpack
i18next-hmr Webpack翻译热更新插件

i18next-hmr Webpack翻译热更新插件

0 次浏览 0 条评论
zip
zip

Webpack 的 i18n 开发调试神器——i18next-hmr，蛮适合你用来搞多语言项目的热更新。它能在客户端和服务器上同时搞定翻译文件的热重载，改个词不用重启服务，响应也快，开发体验妥妥提升。

Node.js v10+，配上Webpack 4.x 或 5.x，就能跑得稳。装个插件也简单，直接：

$ npm install --save-dev i18next-hmr

在你的 webpack.config.js 里加一段：

const { I18NextHMRPlugin } = require('i18next-hmr/plugin');
const path = require('path');


module.exports = {
  // ...其他配置
  plugins: [
    new I18NextHMRPlugin({
      localesDir: path.resolve(__dirname, 'static/locales')
    })
  ]
};

路径指定好后，每次改了 static/locales 下的翻译文件，页面就能自动更新翻译。调试多语言内容，方便得。

如果你用的是 Next.js，一样支持，配置逻辑也差不多。你可以看看这篇：Next.js + next-i18next + Locize 简单示例，讲得还挺清楚。

另外，如果你想搞清楚整个 i18n 的套路，可以顺手翻翻这些：

，如果你正好在做 i18n，尤其是翻译文件经常调整的项目，i18next-hmr真是挺省事的选择。推荐你上手试试，装一下试下效果就知道了。

zip 文件大小：802.16KB