[Translation Module] Extract Message is not working properly

safranx commented 3 years ago

Before opening a new issue, please take a moment to review our community guidelines to make the contribution process easy and effective for everyone involved.

Description

I tried to add new translations, to a generated component but I am getting an error:

TypeError: Cannot readt property 'whatever' of undefined

Steps to reproduce

Steps to reproduce the behavior:

> npx create-react-app --template cra-template-rb my-app
> cd my-app
> yarn run cleanAndSetup
> yarn generate component Footer

Adding a new translation entry to messages.ts (in the new build component (Footer)) Extracting messages to generate the new entry in translation.json files: yarn run extract-messages.

QUICK FIX

You have to edit the function isImportedTranslationObject(content, key). In internals\extractMessages\stringfyTranslations.js remplace +locales/i18n.* by +locales/translations.*

function isImportedTranslationObject(content, key) {
  const pattern = `import {.*?${key}.*?} from.+locales/translations.*`;
  return RegExp(pattern, 'gim').test(content);
}

Versions

react-boilerplate-cra-template: v1.1.1
Node/NPM: v14.15.1
Browser: Version 1.18.75 Chromium: 87.0.4280.101 (Official Build) (64 bits)

Can-Sahin commented 3 years ago

Good catch. Thanks

Can-Sahin commented 3 years ago

Fixed with https://github.com/react-boilerplate/react-boilerplate-cra-template/commit/4b8788c9b9d9e3004feebf8e04fdb96e16a3a2d7

safranx commented 3 years ago

Translations aren't working properly if the component or container isn't import with his "optional" Loadable.ts.

react-boilerplate / react-boilerplate-cra-template