rollup-plugin-messageformat

3.0.0 verified Mon Apr 27 auth: no javascript

Rollup plugin that lets you import JSON, YAML, and .properties files containing ICU MessageFormat messages, converting them into message functions compatible with @messageformat/react and @messageformat/runtime. Current stable version is 3.0.0, supporting Node >=14 and shipping TypeScript types. The plugin handles locale-aware file matching, key-path parsing for .properties, and tree-shaking by extracting only used messages. It requires @messageformat/runtime as a runtime peer dependency for generated code. Unlike manual message loading, it integrates directly into the Rollup build pipeline, enabling efficient code splitting and smaller bundles.

Common errors

error Error: Cannot find module '@messageformat/runtime' ↓

cause Missing runtime dependency required by generated code.

fix

Install @messageformat/runtime: npm install @messageformat/runtime

error TypeError: messageformat is not a function ↓

cause Attempting to call the plugin as a function instead of using the named export.

fix

Use import { messageformat } from 'rollup-plugin-messageformat' in ESM, or const { messageformat } = require('rollup-plugin-messageformat') in CJS.

Warnings

deprecated The "locales" option with value '*' is deprecated and will be removed in a future major version. ↓

fix Explicitly list your supported locales in an array: locales: ['en', 'fr', 'de'].

Install

npm install rollup-plugin-messageformat

yarn add rollup-plugin-messageformat

pnpm add rollup-plugin-messageformat

Imports

messageformat
wrong
```
const messageformat = require('rollup-plugin-messageformat')
```
correct
```
import { messageformat } from 'rollup-plugin-messageformat'
```
The plugin exports a named export, not a default. CJS require will not work as expected in ESM projects.

Quickstart

Sets up Rollup with the messageformat plugin, imports YAML message files, and uses the generated message functions with locale data.

// rollup.config.js
import { messageformat } from 'rollup-plugin-messageformat';

export default {
  input: 'src/index.js',
  output: { format: 'es', dir: 'dist' },
  plugins: [
    messageformat({
      locales: ['en', 'fr'],
      include: ['**/messages/**']
    })
  ]
};

// src/index.js
import frMessages from './messages/fr.yaml';
import enMessages from './messages/en.yaml';

const messages = { en: enMessages, fr: frMessages };
console.log(messages.en.hello({ name: 'World' }));
console.log(messages.fr.hello({ name: 'Monde' }));

// messages/en.yaml
// hello: "Hello, {name}!"
// messages/fr.yaml
// hello: "Bonjour, {name}!"