fix: hmr on locale dir/file rename or deleted

package.json

@@ -60,15 +60,19 @@
     "vite": ">=4.0.0"
   },
   "dependencies": {
+    "bcp-47": "^2.1.0",
     "clone-deep": "^4.0.1",
     "debug": "^4.3.4",
     "fast-glob": "^3.3.1",
     "fs-extra": "^11.1.1",
+    "iso-639-1": "^3.1.0",
     "json5": "^2.2.3",
     "parse-glob": "^3.0.4",
     "picocolors": "^1.0.0",
     "string.prototype.trimend": "^1.0.7",
-    "uniq": "^1.0.1"
+    "throttle-debounce": "^5.0.0",
+    "uniq": "^1.0.1",
+    "watcher": "^2.3.0"
   },
   "devDependencies": {
     "@minko-fe/eslint-config": "^2.0.0",
@@ -79,6 +83,7 @@
     "@types/fs-extra": "^11.0.2",
     "@types/parse-glob": "^3.0.30",
     "@types/react": "^18.2.28",
+    "@types/throttle-debounce": "^5.0.0",
     "bumpp": "^9.2.0",
     "conventional-changelog-cli": "^4.1.0",
     "eslint": "8.51.0",

playground/spa/src/App.tsx

@@ -14,6 +14,7 @@ function App() {
       <div id='language' style={{ marginBottom: '16px' }}>
         {t('test.key')}
       </div>
+      <div>extra: {t('more.a.b.c')}</div>
       <button
         onClick={async () => {
           await i18n.changeLanguage('zh')

playground/spa/src/locale/de/more.json

@@ -1,7 +1,7 @@
 {
-  "mo": {
-    "fdsa": {
-      "ff": "fdasf"
+  "a": {
+    "b": {
+      "c": "dxx"
     }
   }
 }

playground/spa/src/locale/en/more.json

@@ -0,0 +1,7 @@
+{
+  "a": {
+    "b": {
+      "c": "aaaa"
+    }
+  }
+}

src/plugin/index.ts

@@ -4,6 +4,8 @@ import { RESOLVED_VIRTUAL_PREFIX, RESOURCE_VIRTURL_HELPER, VIRTUAL } from './uti
 import { LocaleDetector } from './locale-detector/LocaleDetector'
 import { debug } from './utils/debugger'
 import { type EnableParsersType } from './parsers'
+import { initWatcher } from './utils/file-watcher'
+import { hmr } from './utils/hmr'
 
 export interface I18nDetectorOptions {
   /**
@@ -92,7 +94,7 @@ export async function i18nDetector(options: I18nDetectorOptions) {
           let code = `export default { `
           for (const k of Object.keys(modules)) {
             // Currently rollup doesn't support inline chunkName
-            // TODO: chunk name
+            // TODO: inline chunk name
             code += `'${k}': () => import('${VIRTUAL}-${k}'),`
           }
           code += ' };'
@@ -108,25 +110,32 @@ export async function i18nDetector(options: I18nDetectorOptions) {
 
       return null
     },
+    configureServer(server) {
+      initWatcher(options.localesPaths, async (_type, p, pnext) => {
+        if (!p) return
+
+        debug('watcher', p, '=========>', pnext)
+        const _hmr = async () => {
+          await localeDetector.init()
+          hmr(server, localeDetector)
+        }
+
+        if (path.extname(p) && localeDetector.allLocaleFiles.has(p)) {
+          // file
+          _hmr()
+        }
+        if (localeDetector.allLocaleDirs.has(p)) {
+          _hmr()
+        }
+      })
+    },
     async handleHotUpdate({ file, server }) {
       const updated = await localeDetector.onFileChanged({ fsPath: file })
 
       if (updated) {
         const { resolvedIds } = localeDetector.localeModules
         debug('hmr', resolvedIds)
-        for (const [, value] of resolvedIds) {
-          const { moduleGraph, ws } = server
-          const module = moduleGraph.getModuleById(RESOLVED_VIRTUAL_PREFIX + value)
-          if (module) {
-            moduleGraph.invalidateModule(module)
-            if (ws) {
-              ws.send({
-                type: 'full-reload',
-                path: '*',
-              })
-            }
-          }
-        }
+        hmr(server, localeDetector)
       }
     },
   } as PluginOption