@intlify/core

What is @intlify/core?

@intlify/core is a core library for internationalization (i18n) in JavaScript applications. It provides essential functionalities for managing translations, formatting messages, and handling locale-specific data. This package is part of the Intlify project, which aims to offer a comprehensive solution for i18n in modern web applications.

What are @intlify/core's main functionalities?

Creating an i18n instance

This feature allows you to create an i18n instance with specified locales and messages. The i18n instance can then be used to manage translations in your application.

const { createI18n } = require('@intlify/core');
const i18n = createI18n({
  locale: 'en',
  messages: {
    en: { welcome: 'Welcome' },
    fr: { welcome: 'Bienvenue' }
  }
});

Translating messages

This feature allows you to translate messages based on the current locale. The `t` method is used to fetch the translated message for a given key.

const message = i18n.t('welcome');
console.log(message); // Output: 'Welcome'

Changing locale

This feature allows you to change the current locale of the i18n instance. Once the locale is changed, all subsequent translations will be based on the new locale.

i18n.locale = 'fr';
const message = i18n.t('welcome');
console.log(message); // Output: 'Bienvenue'

Other packages similar to @intlify/core

i18next

i18next is a popular internationalization framework for JavaScript. It provides similar functionalities to @intlify/core, such as managing translations, handling locales, and formatting messages. i18next is known for its extensive plugin system and support for various frameworks like React, Vue, and Angular.

react-intl

react-intl is a library specifically designed for internationalization in React applications. It offers components and APIs to manage translations, format messages, and handle locale-specific data. While it is similar to @intlify/core in terms of functionality, react-intl is tailored for React and provides a more integrated experience for React developers.

vue-i18n

vue-i18n is an internationalization plugin for Vue.js applications. It provides functionalities for managing translations, handling locales, and formatting messages. vue-i18n is similar to @intlify/core but is specifically designed for Vue.js, offering seamless integration with Vue components and the Vue ecosystem.

README

@intlify/core

The intlify core module for i18n

Which dist file to use?

From CDN or without a Bundler

• core(.runtime).global(.prod).js:

  • For direct use via <script src="..."> in the browser. Exposes the IntlifyCore global
  • Note that global builds are not UMD builds. They are built as IIFEs and is only meant for direct use via <script src="...">
  • In-browser locale messages compilation:
    • core.global.js is the "full" build that includes both the compiler and the runtime so it supports compiling locale messages on the fly
    • core.runtime.global.js contains only the runtime and requires locale messages to be pre-compiled during a build step
  • Inlines internal the bellow packages - i.e. it’s a single file with no dependencies on other files. This means you must import everything from this file and this file only to ensure you are getting the same instance of code
    • @intlify/shared
    • @intlify/message-compiler
  • Contains hard-coded prod/dev branches, and the prod build is pre-minified. Use the *.prod.js files for production

• core(.runtime).esm-browser(.prod).js:

  • For usage via native ES modules imports (in browser via <script type="module">)
  • Shares the same runtime compilation, dependency inlining and hard-coded prod/dev behavior with the global build

With a Bundler

• core(.runtime).esm-bundler.js:
  • For use with bundlers like webpack, rollup and parcel
  • Leaves prod/dev branches with process.env.NODE_ENV guards (must be replaced by bundler)
  • Does not ship minified builds (to be done together with the rest of the code after bundling)
  • Imports dependencies (e.g. @intlify/message-compiler)
    • Imported dependencies are also esm-bundler builds and will in turn import their dependencies (e.g. @intlify/message-compiler imports @intlify/shared)
    • This means you can install/import these deps individually without ending up with different instances of these dependencies, but you must make sure they all resolve to the same version
  • In-browser locale messages compilation:
    • core.runtime.esm-bundler.js (default) is runtime only, and requires all locale messages to be pre-compiled. This is the default entry for bundlers (via module field in package.json) because when using a bundler templates are typically pre-compiled (e.g. in *.json files)
    • core.esm-bundler.js: includes the runtime compiler. Use this if you are using a bundler but still want locale messages compilation (e.g. templates via inline JavaScript strings)

For Node.js (Server-Side)

• core.cjs(.prod).js:
  • For use in Node.js via require()
  • If you bundle your app with webpack with target: 'node' and properly externalize @intlify/core, this is the build that will be loaded
  • The dev/prod files are pre-built, but the appropriate file is automatically required based on process.env.NODE_ENV

:copyright: License

MIT

Changelog

v9.2.0-beta.10 (2021-09-30)

:zap: Improvement Features

• vue-i18n-core
  • #709 improvement: support vue-i18n-loader bridge mode (@kazupon)

Committers: 1

• kazuya kawaguchi (@kazupon)