Internazionalization (i18n) via public folder is not possible without build between changes

[philheller]

Build tool

Vite

Where do you see the problem?

• [X] In the browser
• [ ] In the terminal

Describe the bug

The publicDir is updated when changes occur. However, I believe that the _locales are registered as soon as an extension is loaded. One also has to specify the "default_locale" key in the manifest.json (as specified in the chrome docs).

I think we need a strategy for _locales, maybe check for _locales in the public folder and include them in the dist in dev mode? I am not sure if there is a better way with HMR...

Reproduction

1. Create project (as described in the crxjs docs)
2. Create file (at _locale/en/messages.json) containing examplary message:

   {
   "hello": { "message": "world" }
   }

3. Add default_local: "en" to manifest.json or manifest.config.ts respectively
4. Use i18n in App.tsx

   <p>{chrome.i18n.getMessage("hello")}</p>

5. Add index.html to manifest.config.ts popup:

   action: {
   default_popup: "index.html",
   },

6. Run npm run dev
7. Check the extension's popup (should not contain the translation)
8. Run npm run build && npm run dev
9. Check the extension's popup again and now it's there (yet no HMR)

Logs

No response

System Info

System:
    OS: Windows 10 10.0.22621
    Memory: 16 GB
  Binaries:
    Node: 18.12.1 - C:\Program Files\nodejs\node.EXE
    npm: 8.19.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.22621.819.0),
    Chromium (107.0.1418.56)
    Firefox: (107.0.1)
  npmPackages:
    @crxjs/vite-plugin: ^2.0.0-beta.7 => 2.0.0-beta.7
    vite: ^3.2.3 => 3.2.4

Severity

annoyance

Note

Love this project!

[bartholomej]

Have you tried moving _locales folder in the project root? It works as it should for me ;)

"@crxjs/vite-plugin": "^2.0.0-beta.11"
"vite": "^4.0.3",
"vite-plugin-solid": "^2.5.0"