Compiling messages during build

[glen-84]

The messageformat documentation recommends using messageformat as a compile-time tool, to avoid having to download the compiler to the client and compile messages at run-time. It also solves the CSP issue.

Is there any way to use pre-compiled messages with this library?

[lephyrus]

I don't think that's a use case for this library, to be honest. But I've had the same idea for some time, and I agree that it would be a better solution. I feel it should be a separate library. I've been wanting to take a crack at it, but I didn't get around to it so far.

[AndreasHae]

@lephyrus I managed to get it working by using a custom webpack config which sets up @messageformat/loader for my translation files and then writing a custom TranslateLoader which dynamically imports the translation JSON files. Works like a charm!

Not sure how to package this into a library though, as it requires a custom webpack config to work. Might write a tutorial about it when I have the time

[lephyrus]

@AndreasHae Good to hear that works! 👍 I always wanted to give it a try. The only option off the top of my head was using a custom webpack config too. That's not straight-forward to package, as you say. But more importantly, supplying a custom webpack config is a somewhat niche thing to do: I feel like conceptually, webpack is an implementation detail of the Angular CLI. There's already experimental support for Angular builds that don't use webpack at all.

Still, if you want to try to fork my StackBlitz example app and adapt it to use pre-compiled messages, I'll be happy to link it in the README. (StackBlitz lets you edit angular.json, so I think it should be possible.)

[jeandat]

@lephyrus I managed to get it working by using a custom webpack config which sets up @messageformat/loader for my translation files and then writing a custom TranslateLoader which dynamically imports the translation JSON files. Works like a charm!

Not sure how to package this into a library though, as it requires a custom webpack config to work. Might write a tutorial about it when I have the time

Hi @AndreasHae, did you write that tutorial by any chance? Could be useful to me too. Thanks. 🙏