ttag-org / ttag

:orange_book: simple approach for javascript localization
https://ttag.js.org/
MIT License
338 stars 41 forks source link

[question] Integration with webpack #207

Open marcinn opened 3 years ago

marcinn commented 3 years ago

Hi.

Ttag seems to be best i18n solution. Usage is simple and readable, gettext behind the scenes, but I have trouble integrating ttag with webpack.

I'm using html-webpack-plugin and ttag-webpack-plugin. I'd like to automatically inject precompiled javascripts (bundles / chunks) in language related entrypoints (index-[lang].html). So as a result I'd like to generate index files for each language, with chunks included automatically, to wrap them with nginx in production environment. For a devserver (webpack's watch mode) I would like to have possibility to serve selected language or enable runtime translations. I asked about this on https://stackoverflow.com/questions/63827008/how-to-use-ttag-i18n-with-webpack, where I posted my webpack.config.js.

Would you mind to suggest me (and maybe others) how to configure webpack to work with html-webpack-plugin? If babel-plugin-ttag should be used, could you suggest how to integrate it with html-webpack-plugin?

I'm not using CRA, I have own npm/webpack/babel config.

AlexMost commented 3 years ago

Hi @marcinn! Thanks for the good words. ttag-webpack-plugin is still experimental. Haven't tried it with html-webpack-plugin. Need to check that. I can suggest you to use babel-plugin-ttag without ttag-webpack-plugin. Here is a doc tat describes both approaches (precompile and runtime translations) - https://ttag.js.org/blog/2018/09/05/hardcore-webpack-setup.html