Skip to content
This repository has been archived by the owner on Mar 4, 2019. It is now read-only.

messageformat/yaml-loader

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

14 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

YAML i18n loader for Webpack

Loads YAML files into JavaScript as precompiled functions using yaml-to-messageformat and messageformat.

With the default options, will load Rails i18n YAML files, but can be configured for other contents as well. E.g. for YAML with contents already in ICU MessageFormat, use with options { pluralVariable: null, replacements: [] }.

By default, variables of the form %{foo} and %b will be detected in the input strings, and an object with keys matching the pluralisation classes of the current language (set by having a parent key such as en or fi) will be handled as a proper plural.

Installation

npm install messageformat-yaml-loader

or

yarn add messageformat-yaml-loader

Usage

For a working demo of the following, run npm install in the example/ directory, and then open example/dist/index.html in a browser.

Webpack configuration

{
  test: [/\.yaml$/, /\.yml$/],
  loader: require.resolve('messageformat-yaml-loader'),
  options: {
    biDiSupport: false,
    defaultLocale: 'en',
    includeLocales: null,
    pluralVariable: 'count',
    verbose: false
  }
}

Some of the default option values are shown, but none is required. Most options are passed on to yaml-to-messageformat (see there for their documentation); biDiSupport enables bi-directional text support in messageformat.

messages.yml

en:
  errors:
    format: "%{attribute} %{message}"
    messages:
      confirmation: "doesn't match %{attribute}"
      accepted: "must be accepted"
      wrong_length:
        one: "is the wrong length (should be 1 character)"
        other: "is the wrong length (should be %{count} characters)"
      equal_to: "must be equal to %{count}"

example.js

import messages from './messages.yml'
const { format, messages: errors } = messages.en.errors

errors.accepted()
// 'must be accepted'

format({
  attribute: 'Your message',
  message: errors.wrong_length({ count: 42 })
})
// 'Your message is the wrong length (should be 42 characters)'