extract messages generated in another macro (preval/codegen)

[slorber]

trafficstars

Hi,

I am trying to figure out how to use your macro and preval so that we can generate dynamic translation keys.

By chance, do you know why the following does not work?

// @ts-ignore
import preval from 'preval.macro';

// @ts-ignore
import { defineMessages } from 'react-intl.macro';

const messages = defineMessages({
  'Component.greet1': {
    id: 'Component.greet1',
    defaultMessage: 'Hello, {name}!',
    description: 'Greeting to welcome the user to the app, v1',
  },
});

const generatedMessages = defineMessages(preval`module.exports = {
  'Component.greet2': {
    id: 'Component.greet2',
    defaultMessage: 'Hello, {name}!',
    description: 'Greeting to welcome the user to the app, v2',
  },
};`);

I'm running the following and get as output:

npx babel src/appConstants.tsx --extensions ".ts,.tsx" --config-file "./translations/translations.babelrc"
src/appConstants.tsx -> .messages/src/appConstants.json


import { defineMessages } from "react-intl";
const messages = defineMessages({
  'Component.greet1': {
    id: 'Component.greet1',
    defaultMessage: 'Hello, {name}!',
    description: 'Greeting to welcome the user to the app, v1'
  }
});
const generatedMessages = defineMessages({
  "Component.greet2": {
    "id": "Component.greet2",
    "defaultMessage": "Hello, {name}!",
    "description": "Greeting to welcome the user to the app, v2"
  }
});

I get this being extracted:

[
  {
    "id": "Component.greet1",
    "defaultMessage": "Hello, {name}!",
    "description": "Greeting to welcome the user to the app, v1"
  },
  { "undefined": "Greeting to welcome the user to the app, v2" }
]

Isn't this supposed to be possible? Isn't importing the macros in the correct order enough?

See also this conversation: https://twitter.com/sebastienlorber/status/1127942571790077954