Nâng cấp react-i18next từ 17.x lên 18.x
So sánh API công khai của react-i18next 17.1.13 và 18.0.0, được tính tự động từ kiểu TypeScript. Chữ ký thay đổi là thay đổi có thể không tương thích, không phải điều chắc chắn.
Tóm tắt
| Đường dẫn import bị xóa | 0 |
|---|---|
| Export bị xóa | 0 |
| Chữ ký thay đổi | 5 |
| Thành viên lớp hoặc interface bị xóa | 0 |
| Thành viên lớp hoặc interface thay đổi | 0 |
| Mới bị ngừng hỗ trợ | 1 |
| Thay đổi yêu cầu (engines, phụ thuộc peer) | 3 |
| Export mới | 1 |
Export bị xóa
Không phát hiện.
Chữ ký thay đổi
| export | Trước | Sau |
|---|---|---|
react-i18next · useSSR | (initialI18nStore: Resource, initialLanguage: string): void | (initialI18nStore: Resource, initialLanguage: string, props?: { i18n?: any; } | undefined): void |
react-i18next · ErrorCode | "NO_I18NEXT_INSTANCE" | "NO_LANGUAGES" | "DEPRECATED_OPTION" | "TRANS_NULL_VALUE" | "TRANS_INVALID_OBJ" | "TRANS_INVALID_VAR" | "TRANS_INVALID_COMPONENTS" | "USE_T_BEFORE_READY" | "SUSPENDED_WHILE_LOADING" | "NO_I18NEXT_INSTANCE" | "NO_LANGUAGES" | "DEPRECATED_OPTION" | "TRANS_NULL_VALUE" | "TRANS_INVALID_OBJ" | "TRANS_INVALID_VAR" | "TRANS_INVALID_COMPONENTS" | "USE_T_BEFORE_READY" | "SUSPENDED_WHILE_LOADING" | "I18N_NOT_INITIALIZED" | "ICU_TRANS_RENDER_ERROR" | "GLOBAL_INSTANCE_ON_SERVER" |
react-i18next · I18nContext | React.Context<{ i18n: i18n; }> | React.Context<{ i18n: i18n; defaultNS?: string | string[] | undefined; } | undefined> |
react-i18next · useTranslation | <const Ns extends FlatNamespace | $Tuple<FlatNamespace> | undefined = undefined, const KPrefix extends KeyPrefix<FallbackNs<Ns>> = undefined>(ns?: Ns | undefined, options?: UseTranslationOptions<KPrefix> | undefined): UseTranslationResponse<FallbackNs<Ns>, KPrefix> | UseTranslationSelector | UseTranslationLegacy |
react-i18next · UseTranslationOptions | { i18n?: any; useSuspense?: boolean | undefined; keyPrefix?: KPrefix | undefined; bindI18n?: string | false | undefined; nsMode?: "fallback" | "default" | undefined; lng?: string | undefined; } | { i18n?: any; useSuspense?: boolean | undefined; keyPrefix?: KPrefix | undefined; bindI18n?: string | false | undefined; bindI18nStore?: string | false | undefined; nsMode?: "fallback" | "default" | undefined; lng?: string | undefined; } |
Thành viên lớp hoặc interface bị xóa
Không phát hiện.
Thành viên lớp hoặc interface thay đổi
Không phát hiện.
Mới bị ngừng hỗ trợ
| export | @deprecated |
|---|---|
react-i18next · TransSelectorProps.shouldUnescape | ignored: Trans always decodes HTML entities |
Thay đổi yêu cầu (engines, phụ thuộc peer)
| Trước | Sau | |
|---|---|---|
engines.node | — | >=22 |
peerDependencies.react | >= 16.8.0 | >= 18.0.0 |
peerDependencies.i18next | >= 26.2.0 | >= 27.0.0 |
Export mới (1)
| import | export | kind |
|---|---|---|
react-i18next | ReactOptions | variable |
Changelog giữa các phiên bản này
Văn bản do tác giả gói công bố, hiển thị nguyên trạng.
18.0.0
Released together with i18next 27. The migration guide lists every change with what to do: https://react.i18next.com/latest/migrating-v17-to-v18
### Breaking changes
- requires i18next 27 (peer `>= 27.0.0`) and React 18 or later (peer `>= 18.0.0`). React 16 and 17 apps stay on react-i18next 17: on i18next 27, use react-i18next 17.1.13 or later (it brings the types of the `react` init options), or 18. `useSyncExternalStore` comes from React itself, so `use-sync-external-store` is no longer a dependency.
- `Trans` output no longer depends on `interpolation.escapeValue`: it always decodes HTML entities after parsing, as `IcuTrans` does, in text and in attribute values, both with `react.unescape` (attribute values used the built-in decoder before). With i18next's default `escapeValue: true`, a value `Tom & Jerry` rendered as `Tom & Jerry` and a date `17/12/2025` as `17/12/2025`; both now render as written, and so do entities in the translation itself (`&`, `<`, ` `, ...). Values still render as text, never as markup (since 17.1.10). The `shouldUnescape` prop and `react.transDefaultProps.shouldUnescape` are ignored and warn (`DEPRECATED_OPTION`, in development and with `debug: true`); remove them. Snapshot tests that contain entities inside `Trans` output need an update ([#1903](https://github.com/i18next/react-i18next/issues/1903), [#1893](https://github.com/i18next/react-i18next/issues/1893)).
- `Trans` and `IcuTrans` re-render on language change by themselves: they subscribe to the `react.bindI18n` (default `languageChanged`) and `react.bindI18nStore` events, like `useTranslation`. Before, they only updated when a parent re-rendered ([#1710](https://github.com/i18next/react-i18next/issues/1710)). They still neither load translations nor suspend; with a `t` prop, that `t` still decides the language. `TransWithoutContext` and `IcuTransWithoutContext` stay hook-free.
- the `react` options of an instance stay on that instance. `initReactI18next` copied them into module-wide defaults, so a second instance without `react` options inherited, for example, the first one's `useSuspense: false`. Set them on every instance, or call `setDefaults()` once.
- the `i18n` returned by `useTranslation` (and passed by `withTranslation` and `Translation`) forwards reads and writes to the instance. It was a copy taken when the language changed, so after `await i18n.changeLanguage('de')` the copy still said `en`, and properties set on it never reached the instance. It is still a new object whenever the language changes, for dependency arrays and the React Compiler. Because the old object now reads the current language too, a check like `prevProps.i18n.language !== this.props.i18n.language` (or the language of a `usePrevious(i18n)`) no longer sees a change: compare the objects (`prevProps.i18n !== this.props.i18n`) or keep the previous language yourself.
- `useSSR` and `withSSR` call i18next's `hydrate()` instead of writing `resourceStore.data`,Cung cấp dữ liệu này cho tác tử AI của bạn
Vigia là máy chủ MCP miễn phí: tác tử lập trình của bạn kiểm tra phiên bản, thay đổi phá vỡ tương thích và lỗ hổng trước khi viết mã. Không cần đăng ký, không cần khóa API.
claude mcp add --transport http vigia https://vigia.coredls.cloud/mcp
Thêm vào CursorThêm vào VS Code★ Gắn sao trên GitHub
Mọi ứng dụng MCP khác
{ "mcpServers": { "vigia": { "url": "https://vigia.coredls.cloud/mcp" } } }Kỹ năng cho tác tử (SKILL.md): cho tác tử biết khi nào dùng Vigia · GitHub Action cho pull request
Câu hỏi thường gặp
Nâng cấp react-i18next từ 17 lên 18 có những thay đổi không tương thích nào?
Giữa react-i18next 17.1.13 và 18.0.0, Vigia tìm thấy 0 export bị xóa, 5 chữ ký thay đổi và 0 thành viên lớp hoặc interface bị xóa hay thay đổi.
Những gì bị ngừng hỗ trợ trong react-i18next 18?
1 export hoặc thành viên mới bị đánh dấu ngừng hỗ trợ trong react-i18next 18.0.0.
Dành cho tác tử
GET https://vigia.coredls.cloud/v1/packages/npm/react-i18next/upgrade?from=17.1.13&to=18.0.0