@intlify/core
Advanced tools
@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.
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'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 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 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.
The intlify core module for i18n
core(.runtime).global(.prod).js:
<script src="..."> in the browser. Exposes the IntlifyCore global<script src="...">core.global.js is the "full" build that includes both the compiler and the runtime so it supports compiling locale messages on the flycore.runtime.global.js contains only the runtime and requires locale messages to be pre-compiled during a build step@intlify/shared@intlify/message-compiler*.prod.js files for productioncore(.runtime).esm-browser(.prod).js:
<script type="module">)core(.runtime).esm-bundler.js:
webpack, rollup and parcelprocess.env.NODE_ENV guards (must be replaced by bundler)@intlify/message-compiler)
esm-bundler builds and will in turn import their dependencies (e.g. @intlify/message-compiler imports @intlify/shared)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)core.cjs(.prod).js:
require()target: 'node' and properly externalize @intlify/core, this is the build that will be loadedprocess.env.NODE_ENVv9.2.0 (2022-08-01)
We are excited to announce the release of Vue I18n v9.2 !! This release includes many new features, bug fixes, improvements, and document fixes.
We had commited with 35 contributors. Thanks for your contributing ❤️
In the following, we introduce some of the new features:
From Vue I18n v9.2, we have improved TypeScript support. This allows type checking of resources specified in the messages option of createI18n and complementing with APIs such as t.
The following images is the resoureces type-checked:
The following gif image is the API completion working:
For more information on how to setup the system, please read the docs
WebComponents has been supported since Vue 3.2. You can support your Vue Component with Vue I18n as well.
About details, See more the docs
We have released petite-vue-i18n, a small size subset version of Vue I18n, as an experimental feature.
Only minimal functionality is provided in this module. you can reduce your Vue application bundle size with using this module. If you do not need to use all the features of Vue I18n, this module would be a good option.
About details, See more README
We have released a module called vue-i18n-bridge to support Vue 2 applications with Vue I18n v8.x migrate to Vue 3.
vue-i18n-bridge is a module that is mostly compatible with the Vue I18n v9 API. It's an add-on to existing Vue I18n v8.26.1 or later + Vue 2 applications to take advantage of the Composition API provided in Vue I18n v9. This module would be able to support the progressive migration to Vue 3.
About details, See more the docs
globalInjection option As defaultFrom Vue I18n v9.2, the globalInjection option defaults to true. If you localize by global scope using $t in your template, you no longer need to set this option.
useI18n in Legacy API modeWe have supported for useI18n in Legacy API mode. This feature would be useful if you want to migrate from the options API style to the Composition API style in your Vue 3 application.
About details, See more the docs
vue-i18n-bridge module for migration to Vue 3 of course supports Vue 2.7.
Instead of going from Vue 2.6 to Vue 3 directly, you can migrate your Vue applications using Vue I18n with a strategy of Vue 2.6, Vue 2.7, and then Vue 3 progressively.
v-tWe have supported SSR for v-t. If your Vue application uses v-t, you can support SSR without having to be aware in your Vue application.
#974 feat: change globalInjection option default value (@kazupon)
#838 feat: composer type definition extending (experimental feature) (@kazupon)
#811 feat: backport build-in components to vue-i18n-bridge from vue-i18n-next (@kazupon)
#588 feat: petite-vue-i18n (@kazupon)
#478 improvement: target component highlighting on i18n resources inspector (@kazupon)
useI18n on Legacy API mode (@kazupon)d.ts breaking (@kazupon)Stdio for Studio (@FMGordillo)defaultSFCLang and globalSFCScope to sfc (@userquin)FAQs
@intlify/core
The npm package @intlify/core receives a total of 76,127 weekly downloads. As such, @intlify/core popularity was classified as popular.
We found that @intlify/core demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
Socket researchers uncover how threat actors weaponize Out-of-Band Application Security Testing (OAST) techniques across the npm, PyPI, and RubyGems ecosystems to exfiltrate sensitive data.
Security News
Research
A malicious npm campaign is targeting Ethereum developers by impersonating Hardhat plugins and the Nomic Foundation, stealing sensitive data like private keys.
Research
Security News
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.