withGTConfig()

概述

withGTConfig() 是配置 gt-next 库的主要方式。 它直接包装一个 NextConfig 对象。

import { withGTConfig } from 'gt-next/config';
 
const nextConfig = {
    // 你现有的 next.config.js
}
 
export default withGTConfig(nextConfig, {
  defaultLocale: 'en-US',
  locales: ['en-US', 'es', 'fr'],
});

使用 withGTConfig() 来启用翻译功能不是必须的，但建议配置库以满足您的需求。

使用 withGTConfig() 来：

• 配置支持的语言和默认语言环境（即回退语言）。
• 设置访问 GT 服务的 API 密钥和项目 ID。
• 设置加载行为。
• 配置超时设置。
• 设置自定义端点。
• 自定义翻译行为、缓存和请求批处理。

参考

必需的属性

推荐的属性

高级属性

返回

一个函数 (NextConfig) => NextConfig，用于增强带有指定 GT 设置的 Next.js 配置对象。

异常

如果缺少 projectId 且使用默认 URL，或者需要 API 密钥但缺失，则抛出 Error。

渲染设置

渲染设置控制翻译在加载时的行为。 这仅适用于在运行时发生的翻译。 如果翻译已被缓存，响应时间太短，不足以证明加载行为的合理性。

渲染方法

• skeleton: 渲染一个片段。
• replace: 在等待时以默认语言渲染内容。
• default: 对于相同语言的地区（例如 en-US 和 en-GB），行为类似于 replace。对于不同语言的地区（例如 en-US 和 fr），行为类似于 skeleton。

超时

超时仅适用于运行时翻译，或需要按需执行的翻译，因为它们尚未被缓存。

默认情况下，超时设置为 8 秒。 这一设计决策是为了方便使用免费计划的 vercel 用户，他们的无服务器函数默认超时为 10 秒。

示例

支持的语言环境

此示例将 gt-next 配置为默认语言环境为英语 (en-US)。 它仅支持西班牙语 (es) 和法语 (fr) 的翻译，并提供上下文感知翻译的描述。

如果没有匹配的语言环境，网站将回退到最合适的语言。 它将寻找匹配的语言（即 en-US 和 en-GB），以及用户在其浏览器中设置的其他首选语言。 如果所有其他方法都失败，则将回退到默认语言。

import { withGTConfig } from 'gt-next/config';
 
const nextConfig = {
  // Your other next.js configurations
}
 
export default withGTConfig(nextConfig, {
  defaultLocale: 'en-US',
  locales: ['en-US', 'es', 'fr'],
  description: 'A personal blog about technology and travel',
});

渲染设置

此示例将 gt-next 配置为在等待翻译加载时渲染骨架。 如果翻译超过8秒仍未完成，该方法将超时并渲染默认语言内容。

import { withGTConfig } from 'gt-next/config';
 
const nextConfig = {
  // Your other next.js configurations
};
 
// locales field is left empty, so this configuration supports all 100+ languages
export default withGTConfig(nextConfig, {
  defaultLocale: 'en-US',
  renderSettings: {
    method: 'skeleton',
    timeout: 10000,
  },
});

注意事项

• withGTConfig() 将 GT 翻译功能集成到您的 Next.js 应用中，必须在根配置文件中使用。
• 像 apiKey 和 projectId 这样的参数可以直接在配置中设置，也可以作为环境变量。
• 高级参数如 renderSettings 和 _batchInterval 允许对翻译行为和性能进行细粒度控制。

下一步

• 将翻译添加到您的 CD 过程。
• 在我们的参考指南中阅读更多关于i18n 配置的信息。