升级指南

从 Nexty.dev v1.1.7 以前的多语言功能升级到新的结构。

文件结构对比

v1.1.7- 文件结构

i18n/
├── messages/                # 翻译文件目录
│   ├── en.json              # 英语翻译
│   ├── zh.json              # 中文翻译
│   └── ja.json              # 日语翻译
├── request.ts               # next-intl 请求配置
└── routing.ts               # 路由和语言配置

v1.1.7+ 文件结构

i18n/
├── messages/                # 翻译文件目录
│   ├── en/                  # 英语翻译
│   │   └── common.json
│   ├── zh/                  # 中文翻译
│   │   └── common.json
│   └── ja/                  # 日语翻译
│       └── common.json
├── request.ts               # next-intl 请求配置
└── routing.ts               # 路由和语言配置

升级步骤

步骤1. 更新翻译文件结构

根据上面的文件结构对比，将翻译文件结构更新为新的结构。

然后根据自己的需求进行拆分，例如将 Dashboard 和 Landing 独立拆分出来，分别创建 Dashboard.json 和 Landing.json 文件。

步骤2. 更新请求配置

将 request.ts 文件替换为下面代码：

import { getRequestConfig } from 'next-intl/server';
import { routing } from './routing';
 
export default getRequestConfig(async ({ requestLocale }) => {
  let locale = await requestLocale;
 
  if (!locale || !routing.locales.includes(locale as any)) {
    locale = routing.defaultLocale;
  }
 
  const common = (await import(`./messages/${locale}/common.json`)).default;
  const Landing = (await import(`./messages/${locale}/Landing.json`)).default;
  const Dashboard = (await import(`./messages/${locale}/Dashboard.json`)).default;
 
  return {
    locale,
    messages: {
      Landing,
      Dashboard,
      ...common
    }
  };
});

步骤3. 更新语言提示器 `LanguageDetectionAlert`

将下面代码

const messages = require(`@/i18n/messages/${currentLocale}.json`);
const alertMessages = messages.LanguageDetection;

改成

const messages = require(`@/i18n/messages/${currentLocale}/common.json`);
const alertMessages = messages.LanguageDetection;

这样就完成了升级。以后每次新增翻译文件，只需要在 request.ts 中添加即可。