{"id":20498,"library":"react-intl.macro","title":"react-intl.macro","description":"Run react-intl at build-time with babel-plugin-macros. Current stable version is 0.3.7 (last released Feb 2020; no recent updates, likely maintenance mode). It extracts react-intl defineMessages, FormattedMessage, and FormattedHTMLMessage calls into JSON files during build, leveraging babel-plugin-macros without needing a separate Babel plugin. Different from babel-plugin-react-intl (requires explicit Babel config) and react-intl-cra (Create React App specific) – this macro approach works with any macro-enabled setup (CRA, Next.js, custom builds). Requires react-intl@2 and babel-plugin-macros.","status":"maintenance","version":"0.3.7","language":"javascript","source_language":"en","source_url":"https://github.com/evenchange4/react-intl.macro","tags":["javascript"],"install":[{"cmd":"npm install react-intl.macro","lang":"bash","label":"npm"},{"cmd":"yarn add react-intl.macro","lang":"bash","label":"yarn"},{"cmd":"pnpm add react-intl.macro","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency; the macro replaces imports from react-intl but react-intl is still required for runtime","package":"react-intl","optional":false},{"reason":"Required for macro to work; must be installed and configured in Babel config","package":"babel-plugin-macros","optional":false}],"imports":[{"note":"Replace react-intl import with react-intl.macro to enable build-time extraction","wrong":"import { defineMessages } from 'react-intl'","symbol":"defineMessages","correct":"import { defineMessages } from 'react-intl.macro'"},{"note":"FormattedMessage from the macro extracts defaultMessage during build","wrong":"import { FormattedMessage } from 'react-intl'","symbol":"FormattedMessage","correct":"import { FormattedMessage } from 'react-intl.macro'"},{"note":"FormattedHTMLMessage is also provided by the macro for extraction","wrong":"import { FormattedHTMLMessage } from 'react-intl'","symbol":"FormattedHTMLMessage","correct":"import { FormattedHTMLMessage } from 'react-intl.macro'"}],"quickstart":{"code":"// Install dependencies\n// yarn add react-intl.macro react-intl babel-plugin-macros\n\n// babel-plugin-macros.config.js\nmodule.exports = {\n  'react-intl': {\n    verbose: false,\n  },\n};\n\n// Component.js\nimport { defineMessages, FormattedMessage } from 'react-intl.macro';\n\nconst messages = defineMessages({\n  'App.greet': {\n    id: 'App.greet',\n    defaultMessage: 'Hello, {name}!',\n    description: 'Greeting to welcome the user',\n  },\n});\n\nconst App = () => (\n  <FormattedMessage\n    id=\"App.welcome\"\n    defaultMessage=\"Welcome to our app\"\n    description=\"Welcome message\"\n  />\n);\n\n// Build with MESSAGE_DIR environment variable\n// MESSAGE_DIR='./.messages' react-scripts build\n// Output: .messages/App.json containing extracted messages","lang":"javascript","description":"Shows installation, config, and usage of react-intl.macro to replace react-intl imports and extract messages during build."},"warnings":[{"fix":"Use react-intl v2.x or consider alternative extraction tools for modern react-intl.","message":"Requires react-intl@2; not compatible with react-intl v3+ (which uses createIntl and Provider changes).","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Set MESSAGE_DIR to a directory path, e.g., MESSAGE_DIR='./.messages' react-scripts build","message":"MESSAGE_DIR environment variable must be set during build; otherwise no output is produced.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Consider using babel-plugin-react-intl (v9+) or @formatjs/cli for extraction in modern projects.","message":"Package last updated in 2020; no longer maintained. May not work with newer Babel or macro versions.","severity":"deprecated","affected_versions":">=0.0.0"},{"fix":"Keep injectIntl and other non-extracted imports from 'react-intl'; only replace extraction-targets with react-intl.macro.","message":"Only extracts defineMessages, FormattedMessage, and FormattedHTMLMessage. Other react-intl components (e.g., injectIntl) are not extracted and must still be imported from 'react-intl'.","severity":"gotcha","affected_versions":">=0.0.0"}],"env_vars":null,"search_vec":"'0.3.7':19 '2':94 '2020':23 'app':74 'approach':78 'babel':12,47,54,59,65,97 'babel-plugin-macro':11,46,96 'babel-plugin-react-intl':58 'build':8,44,89 'build-tim':7 'call':39 'config':66 'cra':71,86 'creat':72 'current':15 'custom':88 'definemessag':35 'differ':56 'enabl':84 'explicit':64 'extract':31 'feb':22 'file':42 'formattedhtmlmessag':38 'formattedmessag':36 'intl':5,34,62,70,93 'javascript':100 'json':41 'last':20 'leverag':45 'like':27 'macro':14,49,77,83,99 'macro-en':82 'mainten':28 'mode':29 'need':51 'next.js':87 'plugin':13,48,55,60,98 'react':4,33,61,69,73,92 'react-intl':3,32,91 'react-intl-cra':68 'react-intl.macro':1 'recent':25 'releas':21 'requir':63,90 'run':2 'separ':53 'setup':85 'specif':75 'stabl':16 'time':9 'updat':26 'version':17 'without':50 'work':79","created_at":"2026-04-25T11:23:27.379392+00:00","updated_at":"2026-04-25T11:23:27.379392+00:00","problems":[{"fix":"Install react-intl.macro and babel-plugin-macros; ensure Babel config includes 'macros' plugin.","cause":"Missing installation or babel-plugin-macros not configured.","error":"Module not found: Can't resolve 'react-intl.macro'"},{"fix":"Run 'yarn add babel-plugin-macros' and add 'macros' to your Babel plugins in babel.config.js.","cause":"babel-plugin-macros is not installed or not in the Babel plugins list.","error":"Error: [BABEL] ...: Cannot find module 'babel-plugin-macros'"},{"fix":"Set MESSAGE_DIR environment variable (e.g., MESSAGE_DIR='./.messages') and ensure imports come from 'react-intl.macro', not 'react-intl'.","cause":"MESSAGE_DIR environment variable not set or macro not correctly replacing imports.","error":"No message output files generated after build"}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":"","cli_version":null,"type":"library","homepage":null,"github":"https://github.com/evenchange4/react-intl.macro","docs":null,"changelog":null,"pypi":null,"npm":"https://www.npmjs.com/package/react-intl.macro","openapi_spec":null,"status_page":null,"smithery":null,"categories":["serialization"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-17","next_check":"2026-07-24","install_tag":null}}