messageformat-loader

0.8.1 verified Sat Apr 25 auth: no javascript maintenance

Webpack loader that compiles MessageFormat ICU message strings into JavaScript modules at build time. Supports JSON, YAML, and JS source files containing ICU MessageFormat strings. Compatible with messageformat 1.x and 2.x. The loader transforms message resources into pre-compiled functions for efficient runtime internationalization. While the core messageformat library has moved to v4 (prerelease) with a rewritten API and MF2 spec support, this loader remains at v0.8.1 and only supports the older 1.x/2.x versions. Key differentiator: integrates MessageFormat compilation into webpack pipeline, avoiding runtime compilation overhead.

Common errors

error Module not found: Error: Can't resolve 'messageformat' in '...' ↓

cause Missing peer dependency messageformat

fix

npm install messageformat@^2.0.0

error Error: Cannot find module 'messageformat/compile-module' ↓

cause messageformat version not compatible (e.g., v4 installed)

fix

npm install messageformat@^2.0.0

error TypeError: messageformat_loader is not a function ↓

cause Using loader incorrectly in webpack config (e.g., as a plugin)

fix

Configure as loader: 'messageformat-loader' inside a rules array, not as a plugin.

Warnings

gotcha Loader only supports messageformat 1.x or 2.x; does not work with messageformat v4 ↓

fix Use messageformat 2.x (e.g., 'messageformat': '^2.0.0') or stay on 1.x. Do not install messageformat@4.

deprecated The loader is no longer actively maintained; the underlying messageformat library has moved to v4 with a completely different API ↓

fix Consider migrating to messageformat v4 and using a custom loader or runtime compilation with @messageformat/core

gotcha Locale option is required; if not provided, the loader falls back to 'en' but may produce incorrect date/number formatting for other locales ↓

fix Always specify the 'locale' or 'locales' option matching your message files

Install

npm install messageformat-loader

yarn add messageformat-loader

pnpm add messageformat-loader

Imports

default export

wrong

loader: 'messageformat-loader' // string is fine; but if using options object, must specify properly

correct

// In webpack.config.js:
module.exports = {
  module: {
    rules: [
      { test: /\.json$/, use: 'messageformat-loader' }
    ]
  }
}

Loader is used in webpack config, not in application code. Configure with 'messageformat-loader' as the loader name.

Quickstart

Configures webpack to load JSON message files and compile ICU patterns using messageformat-loader.

// webpack.config.js
module.exports = {
  entry: './src/index.js',
  module: {
    rules: [
      {
        test: /\.json$/,  // or .yaml, .yml
        use: [
          {
            loader: 'messageformat-loader',
            options: {
              locale: 'en',         // default locale
              locales: ['en', 'fr'], // available locales
              biDiSupport: false
            }
          }
        ]
      }
    ]
  }
};

// src/messages/en.json
{
  "greeting": "Hello {name}!",
  "items": "You have {count, plural, =0 {no items} one {# item} other {# items}}."
}

// src/index.js
import messages from './messages/en.json';
console.log(messages.greeting({ name: 'World' })); // "Hello World!"
console.log(messages.items({ count: 3 })); // "You have 3 items."