I am using Firebase to host my Angular app and recently I started migrating from ngx-translate to the angular way of i18n which is translation on build time. This creates a problem with the app because of the dynamic routing, e.g. localhost:4001/:clientId that should now be localhost:4001/{en,el}/:clientId.

The problem is that with some basic configuration, some patterns don't redirect correctly, for example if I ask for localhost:4001/en or localhost:4001/en/, it works. If I ask for localhost:4001/randomClientId, it rewrites it correctly as localhost:4001/en/randomClientId. But, if the clientId starts with en, then something weird happens, it rewrites it like so: localhost:4001/enXYZ => localhost:4001/en/XYZ instead of the expected (in my mind) localhost:4001/en/enXYZ.

Has anyone gone through something similar? Should I be using rewrites, redirects or something else entirely?

I have compiled 2 versions of my Angular app that sit in the following directory:

+ dist/
| + main-web/
| | + en/
| | | [ app files in English ]
| | + el/
| | | [ app files in Greek ]

I don't have a main index.html like the Firebase examples, I just have the 2 translated versions.

My firebase.json config is like so:

{
  "hosting": {
    "public": "dist/main-web",
    "appAssociation": "AUTO",
    "rewrites": [
      {
        "source": "/links/**",
        "dynamicLinks": true
      },
      {
        "source": "/en/**",
        "destination": "/en/index.html"
      },
      {
        "source": "/en",
        "destination": "/en/index.html"
      },
      {
        "source": "/el/**",
        "destination": "/el/index.html"
      },
      {
        "source": "/el",
        "destination": "/el/index.html"
      },
      {
        "source": "**",
        "destination": "/en/index.html"
      }
    ],
    "i18n": { "root": "/" }
  }
}

Last thing I've noticed is that with disabled JS, nothing happens. So firebase hosting emulator doesn't do much I assume? The hosting part in firebase.json writes a JS router? I've enabled angular router tracing to see if it had to do anything with that, but no.

Almost everything works with this, apart from the clientId starting with en. I haven't used glob patterns before so if you could also help me minimize the last 5 rewrites that would be awesome!

0

There are 0 best solutions below