react: migrate to vite by mshima · Pull Request #34656 · jhipster/generator-jhipster

mshima · 2026-08-24T14:09:09Z

Please make sure the below checklist is followed for Pull Requests.

All continuous integration tests are green
Tests are added where necessary
The JDL part is updated if necessary
jhipster-online is updated if necessary
Documentation is added/updated where necessary
Coding Rules & Commit Guidelines as per our CONTRIBUTING.md document are followed
If AI coding assistants (GitHub Copilot, Claude Code, Cursor, etc.) were used to produce significant parts of this PR, it is disclosed in the description above and credited via a Co-authored-by: trailer in the commit(s)
I have personally reviewed, understood, and tested the changes — including any AI-generated code

When you are still working on the PR, consider converting it to Draft (below reviewers) and adding skip-ci label, you can still see CI build result at your branch.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Webpack's HtmlWebpackPlugin injected <base href="/">; Vite does not, so document.querySelector('base') in app.tsx was null and the app crashed on boot. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Vite applies resolve.alias before any plugin, so the 'app' alias rewrote the app/* modules listed in module-federation.config.ts shared before @module-federation/vite could match them, bypassing sharing. Remotes then used their own store instance and the gateway state lacked their reducers. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

@module-federation/vite cannot proxy app-local modules to the host: it only detects named exports of installed packages, so app/* share mappings always resolve to the remote's own copy. The remote injected its reducers into its own store while selectors read the host store. - entities routes use useStore() from the shared react-redux package - drop app/* share mappings (unsupported) and the app alias plugin Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

…deration/vite @module-federation/vite only proxies shared modules to the host when it can detect named exports of an installed package, application modules always resolved to the remote's own copy. Apply the upstream fix (https://github.com/mshima/vite/tree/fix/app-local-shared-import) through patch-package and restore the app/* share mappings and the app alias plugin. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

…app modules to their source Replace the custom alias plugin with vite-tsconfig-paths registered after the federation plugin, tsconfig.json is the single source of truth for the 'app/*' paths. Application modules listed in module-federation.config.ts shared are not installed packages, set 'import' to the source file so the federation plugin can inspect them and proxy the host instance. This removes the need for the @module-federation/vite patch. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

@module-federation/vite does not share @module-federation/runtime, so the microservice's copy of the locale thunk called loadRemote on its own runtime instance where the remote is not registered, leaving the remote entity pages untranslated. A microservice only provides its own translations, import them directly; the gateway keeps using loadRemote on the host runtime for language switches. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Translate components only update when their parent re-renders. On a direct visit of a remote entity page the list re-renders once when the api responds, usually before the microfrontend translations finished registering, leaving the page with untranslated keys. Subscribe the app root to locale.lastChange. Also skip sharing sonar-scanner, a node cli added to dependencies by skipServer applications. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Replace resolve.alias and vite-tsconfig-paths with resolve.tsconfigPaths. Vite honors the tsconfig include, reference tsconfig.vitest.json from tsconfig.json so spec files resolve 'app/*' paths under vitest. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

This reverts commit 2c9aed5.

…18n modules The microfrontend entities menu registers the translations bundled with the microfrontend for the host's current locale and re-registers on locale change, the host no longer loads remote i18n modules through module federation. Remove the i18n-<lang> exposes and simplify the locale reducer to a single loadedKeys bookkeeping. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

Load the application translations before the initial render and register the microfrontend translations when the exposed menu and routes modules are loaded, so the host never renders remote pages with untranslated keys. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

mshima · 2026-08-25T17:30:42Z

I saw translation issues in module-federation videos. Still needs adjusts.

Concurrent callers of registerTranslations (remote menu and routes modules loading in parallel) resolved immediately once the locale was marked as registered, rendering pages before the i18n chunk arrived.

The ribbon (z-index 99999) painted over react-toastify's container (9999) and hid part of the toast message.

mshima · 2026-08-25T20:50:36Z

I saw translation issues in module-federation videos. Still needs adjusts.

Looks resolved.

qmonmert · 2026-08-26T20:06:44Z

path-browserify can be removed

identity-obj-proxy also

qmonmert

👍

github-actions Bot added theme: react theme: front theme: dependencies Pull requests that update a dependency file labels Aug 24, 2026

mshima force-pushed the react-vite branch from d648515 to 2612762 Compare August 24, 2026 14:10

mshima and others added 2 commits August 24, 2026 11:11

react: migrate to vite

b4227da

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

react: add base href to index.html

706c76e

Webpack's HtmlWebpackPlugin injected <base href="/">; Vite does not, so document.querySelector('base') in app.tsx was null and the app crashed on boot. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

mshima force-pushed the react-vite branch from 2612762 to 706c76e Compare August 24, 2026 16:26

mshima and others added 14 commits August 24, 2026 14:03

react: use control.cleanupFiles for webpack files removal

af1733a

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

react: adjusts

d678909

react: move sonar-scanner to devDependencies

4eefe3a

react: adjusts

2c9aed5

Revert "react: adjusts"

4d2c3f2

This reverts commit 2c9aed5.

Merge branch 'main' into react-vite

cd83a44

mshima marked this pull request as ready for review August 25, 2026 15:36

mshima marked this pull request as draft August 25, 2026 16:03

mshima added ci: cypress-video ci: always-upload-cypress-assets labels Aug 25, 2026

upload logs if label matches.

397bdec

github-actions Bot added the theme: CI builds label Aug 25, 2026

mshima and others added 2 commits August 25, 2026 14:24

upload cypress assets if label matches

d4d68a1

mshima added 3 commits August 25, 2026 15:14

react: await pending microfrontend translation registration

18a90ad

Concurrent callers of registerTranslations (remote menu and routes modules loading in parallel) resolved immediately once the locale was marked as registered, rendering pages before the i18n chunk arrived.

react: keep translation registration memoization for microfrontends only

475eb50

react: keep the development ribbon below toast notifications

80c37d9

The ribbon (z-index 99999) painted over react-toastify's container (9999) and hid part of the toast message.

mshima marked this pull request as ready for review August 25, 2026 20:50

DanielFran requested a review from qmonmert August 25, 2026 22:41

client: remove webpack and vue reference

85b2a1d

mshima closed this Aug 26, 2026

mshima reopened this Aug 26, 2026

qmonmert reviewed Aug 26, 2026

View reviewed changes

Comment thread generators/react/templates/vite.config.ts.ejs Outdated

qmonmert reviewed Aug 26, 2026

View reviewed changes

Comment thread generators/react/templates/vite.config.ts.ejs Outdated

mshima added 2 commits August 26, 2026 22:46

react: apply suggestions from review

c0e40d0

Merge branch 'main' into react-vite

c1fe5e4

qmonmert approved these changes Aug 27, 2026

View reviewed changes

DanielFran approved these changes Aug 27, 2026

View reviewed changes

DanielFran merged commit 0dff3dd into jhipster:main Aug 27, 2026
65 checks passed

mshima deleted the react-vite branch August 27, 2026 13:08

mraible added this to the 9.3.0 milestone Aug 30, 2026

Navigation Menu

Uh oh!

Uh oh!

react: migrate to vite - #34656

react: migrate to vite#34656
DanielFran merged 25 commits into
jhipster:mainfrom
mshima:react-vite

mshima commented Aug 24, 2026 •

edited

Loading

Uh oh!

mshima commented Aug 25, 2026 •

edited

Loading

Uh oh!

mshima commented Aug 25, 2026

Uh oh!

qmonmert Aug 26, 2026

Uh oh!

qmonmert Aug 26, 2026

Uh oh!

Uh oh!

Uh oh!

qmonmert left a comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

Uh oh!

Uh oh!

Conversation

mshima commented Aug 24, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

mshima commented Aug 25, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

mshima commented Aug 25, 2026

Uh oh!

qmonmert Aug 26, 2026

Choose a reason for hiding this comment

Uh oh!

qmonmert Aug 26, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

qmonmert left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

mshima commented Aug 24, 2026 •

edited

Loading

mshima commented Aug 25, 2026 •

edited

Loading