Next.js国际化路由指南：next-i18n-router

Next.js国际化路由指南：next-i18n-router

next-i18n-router Next.js App Router internationalized routing and locale detection. 项目地址: https://gitcode.com/gh_mirrors/ne/next-i18n-router

1. 项目目录结构及介绍

next-i18n-router 是一个用于Next.js应用程序的库，它提供了国际化的路由功能以及本地化检测，并允许通过cookie设置用户的首选语言。下面是一个典型的项目结构示例，假设您已集成此库：

• app

  • [locale]
    这个动态段内包含了所有国际化页面和布局。
    • layout.js
      应用特定语言环境的布局组件。
    • page.js
      对应语言环境的具体页面。

• i18nConfig.js
  配置国际化设置，如支持的语言和地区默认值。

• middleware.js
  用于处理国际化的中间件逻辑，根据请求进行重定向或改写路径。

• package.json
  包含项目的依赖信息和脚本命令，比如启动和构建指令。

• 可能还包括 .gitignore, npmignore, prettier.config.js, tsconfig.json 等基础配置文件。

2. 项目的启动文件介绍

虽然直接的“启动文件”可能指代的是Next.js应用的入口点（通常是 pages/_app.js 或在最新的App Router中可能是 app/layout.js），但就本库而言，关键在于如何启动具备国际化路由的程序。这涉及到几个步骤：

• 使用Next.js的标准启动方式 (next dev) 来运行应用。
• 实际上，重要的是正确配置并引入 middleware.js 和 i18nConfig.js 文件，确保中间件被启用并且配置正确。这意味着，在项目初始化之后，核心操作是配置这些文件，而非直接修改启动脚本。

3. 项目的配置文件介绍

i18nConfig.js

// 假设位于项目根目录
const i18nConfig = {
  locales: ['en', 'zh-CN', 'fr'], // 支持的语言列表
  defaultLocale: 'en', // 默认语言
};

export default i18nConfig;

这个文件定义了项目将要支持的语言和地区，以及哪个是默认的语言环境。

middleware.js

在项目的根目录下或者 /src 目录（如果你的项目使用该结构）创建此文件来实现代理路由逻辑。

import { i18nRouter } from 'next-i18n-router';
import i18nConfig from './i18nConfig';

export function middleware(request) {
  return i18nRouter(request, i18nConfig);
}

// 控制中间件的应用范围
export const config = {
  matcher: '/((api|static|.*\\.*|_next)*)',
};

这里引入了next-i18n-router中间件，并指定它的工作配置，包括匹配规则。

综上所述，集成next-i18n-router涉及调整或添加上述提到的配置和文件，以实现Next.js应用的多语言路由支持。务必参照官方仓库的最新文档以获取完整的配置选项和最佳实践。

next-i18n-router Next.js App Router internationalized routing and locale detection. 项目地址: https://gitcode.com/gh_mirrors/ne/next-i18n-router