firebase-tools icon indicating copy to clipboard operation
firebase-tools copied to clipboard

Feature Request : Support i18n + ssr

Open modernduck opened this issue 2 years ago • 4 comments

Hi I have tried some solutions to provide both i18n and server-side rendering but it seem firebase have limitation that baseHref of each locale must be "" so I can't figure way around this.

It will be nice if we can have solution for this kind of usecase.

Please submit feature requests through our support page.

modernduck avatar Oct 13 '23 10:10 modernduck

Firebase uses rewrites rather than redirects for i18n, we should document this but for SSR the locale is passed as an argument to the express app factory in your server.ts.

jamesdaniels avatar Nov 29 '23 23:11 jamesdaniels

Our test suite uses i18n FYI, see our angular.json and server.ts

jamesdaniels avatar Dec 11 '23 16:12 jamesdaniels

thank you @jamesdaniels

It worked 100% for me, with angular projects, ssr, i18n and firebase hosting.

douglasgc avatar Jan 08 '24 18:01 douglasgc

@jamesdaniels How do you change the locale? registerLocaleData doesn’t seem to work for me. I assume the server should handle the language change. I tried following this setup: https://github.com/lostium/ssr-i18n-angular17, but I'm encountering an issue where dist/<project>/browser/<locale>/index.html cannot load JS and CSS files because baseHref is set to "". I tried adjusting the path with an additional postbuild script, but that caused more problems.

After a few days of trying, I almost gave up, but then I found this issue. Honestly, it gave me some hope.

vosamoilenko avatar Sep 04 '24 19:09 vosamoilenko

Hi,

As @jamesdaniels mentioned, Firebase uses rewrites to support i18n. I've created repository with simple example how to configure Angular (version 20) app which supports i18n, ssr and it's deployable to Firebase (using firebase-tools - 14.6.0)

https://github.com/monogramdesign/firebase-tools-test-apps/tree/main/angular/example-i18n-ssr-app

Please take a look at the configuration of angular.json and firebase.json, these files contain the most crucial settings for applications of this type.

9kubczas4 avatar Jun 06 '25 13:06 9kubczas4