如何使用 react-i18next 定义消息

Question

我想问一个问题，react-i18next是否为我们提供了一种将消息定义为react-intl

的方法

我想先定义所有消息，然后使用 i18next-scanner 提取到 json 文件。

在此先感谢您对此事的帮助。

Answer 1

经过一段时间的研究。如果有人想在 messages.js 中定义消息，我会让路。顺便说一句，我正在使用 i18nxt-scanner 将消息提取到 JSON 文件。

i18next-scanner.config.js

module.exports = {
  input: [
    'src/app/**/*.{js,jsx}',
    // Use ! to filter out files or directories
    '!app/**/*.spec.{js,jsx}',
    '!app/i18n/**',
    '!**/node_modules/**',
  ],
  output: './',
  options: {
    debug: true,
    removeUnusedKeys: true,
    func: {
      list: ['getTranslationId'],
      extensions: ['.js', '.tsx'],
    },
    lngs: ['en', 'ko'],
    ns: ['translation'],
    defaultLng: 'en',
    defaultNs: 'translation',
    defaultValue: '',
    resource: {
      loadPath: 'src/locales/{{lng}}/{{ns}}.json',
      savePath: 'src/locales/{{lng}}/{{ns}}.json',
      jsonIndent: 2,
      lineEnding: '\n',
    },
    nsSeparator: false, // namespace separator
    keySeparator: false, // key separator
    interpolation: {
      prefix: '{{',
      suffix: '}}',
    },
  },
};

messages.js

import { getTranslationId } from 'locales/utils';

const messages = {
  title: getTranslationId('Homepage_title', {
    defaultValue: 'hello, {{name}}',
  }),
  count: getTranslationId('Homepage_count', {
    defaultValue: '{{count}} time',
    count: 0, // for plurals
  }),
};

export default messages;

locales/utils.js

export const getTranslationId = id => {
  if (!id || !id.includes('_'))
    throw new Error('ID pattern should be "BLOCK_ElEMENT"');
  return id;
};

提取命令

yarn run i18next-scanner

希望对您有所帮助！ :D

如何使用 react-i18next 定义消息

How to define messages with react-i18next

react-i18next