angular-intlayer esbuild

[Dus1988]

Modern angular no longer uses webpack, and I would wager most projects do not want to do a full Vite/analog build pipeline.

Is there a roadmap for an esbuild plugin for the angular-intlayer package?

With angular you can use either NX's builder or angular-builders' custom-esbuild to enable esbuild plugin support in the modern angular ecosystem.

[aymericzip]

Hey @Dus1988

Yes I had multiple tries to make angular-intlayer work with vite, but I'm still without solution. I keep investigating

[aymericzip]

Hey @Dus1988

I was able to make intlayer work on angular 21. the set up is not as straight forwards than analog, but it works. see https://intlayer.org/doc/environment/angular

To try it out, install all packages using v8.11.0-canary.0

[aymericzip]

More than happy to collect your feedback regarding the implementation

[Dus1988]

@aymericzip awesome thanks! I'll give this go soon.

I did also tinker around with building a esbuild plugin for it, and got it working for dev server as well as prod build, oh and I needed to make shims for karma/jasmine. I did some things I considered kinda hacky, and your config setup looks cleaner (such as for dev server I did a index transform to add a import map script tag). Will report back.

[aymericzip]

Hey @Dus1988
Oh ok, feel free to share it, really curious to see that.
Import map is indeed a solution, one limitation I see is the build optimization.

I still have to provide instructions for:

• Multilingual page metadata + hreflang
• Routing (/ /fr /es)
• Link adjustment (/about should be /fr/about in french)
• Multilingual sitemap + robots.txt
• Using custom babel plugins for build optimization

Here is an example using astro https://intlayer.org/doc/environment/astro#step-6-localized-routing

If you of someone else has the opportunity to complete the doc, you're welcome

[Dus1988]

@aymericzip

Ok I just got a chance to try out the new plugin

Just a small note to start, since I am using NX I had to do a mjs file that exports the plugin call instead of the TS. Was getting loadModule undefined issues.

The other thing is, and I was dealing with the same behavior in my crude plugin, when I add a new key to a dictionary, it is triggering Angular dev server rebuild, however, if I try to use it in a template I get a compile error saying the new key does not exist. It's fine if I close and trigger a new serve. Seems like maybe the intlayer generation finishes fine for ide types, but the compiled app does not see the type on rebuild.