Registry / serialization / react-intl-webpack-plugin

react-intl-webpack-plugin

library0.3.1jsnpmunverified

This webpack plugin integrates with babel-plugin-react-intl to extract and aggregate internationalization messages from React components into a single JSON file, typically named reactIntlMessages.json. Version 0.3.1 is the latest stable release. It assists in the i18n workflow by combining extracted message descriptors during the webpack build and placing the output in the webpack output directory. Compared to other i18n tools, it focuses on the extraction and aggregation step for webpack-based React projects, leveraging babel metadata. It requires babel-loader >= 6.0.0, babel-plugin-react-intl >= 2.3.0, and webpack >= 4.0.0. The plugin is designed to work with translation memory tools and a separate reactIntlJson-loader for loading translated JSON files.

serialization devops

npm install react-intl-webpack-plugin

github ↗package ↗

INSTALL

IMPORT

SIG · REACT-INTL-WEBPACK

react-intl-webpack-plugin

serializationjavascriptv0.3.1

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

default

✓ const ReactIntlPlugin = require('react-intl-webpack-plugin'); // or import ReactIntlPlugin from 'react-intl-webpack-plugin';

✗ const { ReactIntlPlugin } = require('react-intl-webpack-plugin');

The package exports a single constructor; named import is incorrect.

metadataContextFunctionName

✓ ReactIntlPlugin.metadataContextFunctionName

Used in babel-loader query under metadataSubscribers.

Configures webpack with babel-loader and react-intl-webpack-plugin for i18n message extraction.

// webpack.config.js const ReactIntlPlugin = require('react-intl-webpack-plugin'); module.exports = { // ... other config module: { rules: [ { test: /\.jsx?$/, exclude: /node_modules/, use: { loader: 'babel-loader', options: { cacheDirectory: true, metadataSubscribers: [ReactIntlPlugin.metadataContextFunctionName], plugins: [ '@babel/plugin-transform-runtime', ['react-intl', { enforceDescriptions: false }] ], presets: ['@babel/preset-env', '@babel/preset-react'] } } } ] }, plugins: [ new ReactIntlPlugin() ] };

Debug

Known issues

gotchaWhen using webpack-dev-server, assets are only in memory; the output file is not written to disk.

fix

Access via http://localhost:port/reactIntlMessages.json or run a production build to write the file to disk.

affects: >=0.0

gotchaIf no messages are generated, babel-loader's cache may be stale; clean the cache or set cacheDirectory to false.

fix

Delete .babel-cache or set cacheDirectory: false temporarily.

affects: >=0.0

Errors

Common errors & fixes

TypeError: ReactIntlPlugin is not a constructor

Using named import instead of default import.

fix

Use: const ReactIntlPlugin = require('react-intl-webpack-plugin');

Error: Cannot find module 'react-intl-webpack-plugin'

Package not installed or missing from node_modules.

fix

Run npm install react-intl-webpack-plugin --save-dev

Upgrade

Version history

0.3.1latest on npm

Audit

Dependencies

babel-loaderrequiredPeer dependency required for Babel integration

babel-plugin-react-intlrequiredPeer dependency for extracting messages

webpackrequiredPeer dependency for webpack plugin integration

Agent activity

7 hits · last 30 days

node

Amazon

Resources

githubhttps://github.com/Ognian/react-intl-webpack-plugin ↗

packagehttps://www.npmjs.com/package/react-intl-webpack-plugin ↗