JavaScript 国际化：利用 Intl API 实现浏览器原生国际化
JavaScript 将 Intl API 作为内置标准，用于格式化数字、日期和列表，以及处理不同语言环境下的复数规则。无需外部库。该 API 受到所有现代浏览器和 Node.js 的支持，开箱即用即可提供基于语言环境的字符串比较、分段和相对时间格式化功能。
Add i18n to plain JavaScript in three steps
There is no JavaScript-specific package to install: @better-i18n/core is the plain-JavaScript client every other SDK here wraps.
Install the client
One dependency-free package. It runs in browsers, Node, Deno, Bun and Cloudflare Workers.
npm install @better-i18n/core
# Zero dependencies. Runs in browsers, Node, Deno,
# Bun and Cloudflare Workers.Create the client once
Instantiate at module scope so the 60-second in-memory cache is shared instead of rebuilt on every call.
import { createI18nCore } from '@better-i18n/core'
export const i18n = createI18nCore({
projectId: 'your-org/your-project', // Settings → General → Project ID
defaultLocale: 'en',
})Read a message
getMessages returns a plain nested object, so a four-line lookup helper is the whole runtime you need.
import { i18n } from './i18n.js'
const messages = await i18n.getMessages('en')
// getMessages resolves to { namespace: { key: value } }
const t = (path) =>
path.split('.').reduce((node, part) => node?.[part], messages) ?? path
document.querySelector('h1').textContent = t('home.title')
// Locales come from the project manifest, not a hardcoded array
const languages = await i18n.getLanguages()How it works
Where a JavaScript string comes from
No build step and no bundled locale files: the client resolves a locale at runtime and the edge answers it.
Read path — every locale load
Reads from the plain object getMessages() already returned.
0 network calls per render
getMessages(locale) — served from the in-memory cache if it is warm.
60s TTL · 0 deps
Cloudflare worker answers from the nearest edge cache.
max-age=60 · always 200
The published translation files the sync worker wrote.
source of truth
Fallback chain — tried in order when a hop fails
Write path — dashboard to app
Proposal reviewed in the dashboard, glossary enforced.
MCP · dashboard · CLI
Sync worker writes the locale files to R2.
better-i18n publish
Fire-and-forget purge of the affected keys and the manifest.
non-critical by design
The next getMessages() past the TTL returns the new copy.
~60s worst case
With the client, or with fetch
The client adds caching, retries and the fallback chain. If you would rather own that yourself, the CDN is a plain JSON endpoint.
import { i18n } from './i18n.js'
import { normalizeLocale } from '@better-i18n/core'
let current = 'en'
let messages = await i18n.getMessages(current)
export async function setLocale(next) {
// The CDN stores locales lowercased: pt-BR → pt-br
current = normalizeLocale(next)
messages = await i18n.getMessages(current)
document.documentElement.lang = current
render()
}JavaScript Intl API 实践
在任意现代浏览器或 Node.js 运行时中，使用内置 Intl 构造函数对货币、日期和序数进行格式化，输出符合区域设置的内容。
// Using the built-in Intl API
const formatter = new Intl.NumberFormat('de-DE', {
style: 'currency',
currency: 'EUR',
});
console.log(formatter.format(1234.56)); // "1.234,56 €"
// Date formatting
const date = new Intl.DateTimeFormat('ja-JP', {
year: 'numeric',
month: 'long',
day: 'numeric',
});
console.log(date.format(new Date())); // "2026年3月2日"
// Pluralization
const plural = new Intl.PluralRules('en');
const suffixes = { one: 'st', two: 'nd', few: 'rd', other: 'th' };
function ordinal(n) {
return `${n}${suffixes[plural.select(n)]}`;
}JavaScript Intl API 功能
相关指南
浏览其他框架指南
Get started
立即开始 JavaScript 国际化
借助人工智能驱动的工作流、命令行同步以及低于 50 毫秒的 CDN 交付，管理您的 JavaScript 翻译。