close
  • 中文
  • useI18n

    useI18n 让你在自定义组件中读取配置好的多语言文案。配置细节请参阅 config.i18nSource

    Rspress 提供了 useI18n 这个 hook 来获取国际化文本,使用方式如下:

    import { useI18n } from '@rspress/core/runtime';
    
    const MyComponent = () => {
      const t = useI18n();
    
      return <div>{t('gettingStarted')}</div>;
    };

    为了获得更好的类型提示,你可以在 tsconfig.json 中配置 paths:

    {
      "compilerOptions": {
        "paths": {
          "i18n": ["./i18n.json"]
        }
      }
    }

    然后在组件中这样使用:

    import { useI18n } from '@rspress/core/runtime';
    
    const MyComponent = () => {
      const t = useI18n<typeof import('i18n')>();
    
      return <div>{t('gettingStarted')}</div>;
    };

    这样你就可以获得 i18n.json 中定义的所有文本 key 的类型提示了。