ivandotv / nextjs-translation-demo

Example of Next.js localization with Lingui.js
linguijs-translation-demo.vercel.app
19 stars 7 forks source link

Updates for LogRocket article #67

Open timofei-iatsenko opened 1 year ago

timofei-iatsenko commented 1 year ago

https://blog.logrocket.com/complete-guide-internationalization-nextjs/

Hi, since this article was written, many things changed.

  1. nextjs is shipped by default with SWC compiler enabled, and babel is processing the code. LinguiJS has a dedicated plugin for SWC
  2. The code for loading catalogs is redundant https://github.com/ivandotv/nextjs-translation-demo/blob/main/src/utils.ts#L13-L20 if you already use webpack loader you don't have to compile them for production and complicating your build workflow. Just always use loader. It's doing absolutely the same as lingui compile but integrated in the build process so you don't have to do it manually.
  3. You can reuse nextjs configuration in lingui.config, and make things DRY example: https://github.com/lingui/swc-plugin/blob/main/examples/nextjs-13/lingui.config.js

It would be great if you can update an article, if you want i can create a PR with updates mentoned here.

ivandotv commented 1 year ago

It would be great if you could make a PR 👍

timofei-iatsenko commented 1 year ago

There are actually two ways how nextjs could be configured for current day. With SWC and with Babel. So it should be mentioned in the article. I'm going to configure it with a SWC because it's a new default. But there are some people who still use babel for many resons (they use some custom plugins not ported to SWC)

timofei-iatsenko commented 1 year ago

It's better to update the page, because some code snippets mentioned there are confusing and require more work from developers. People just copypasting it to theirs project and then struggling with all this build steps and how they are related to each other

Especially it's true for this

The code for loading catalogs is redundant https://github.com/ivandotv/nextjs-translation-demo/blob/main/src/utils.ts#L13-L20 if you already use webpack loader you don't have to compile them for production and complicating your build workflow. Just always use loader. It's doing absolutely the same as lingui compile but integrated in the build process so you don't have to do it manually.