javascript - i18n 与 create-react-app (react/router/redux/typescript) 的最佳选择

Question

我使用 create-react-app-ts 创建了一个新的 React 应用程序。添加 i18n 的最佳选择是什么？

我查看了 react-intl，但使用起来看起来很繁重。然后我查看了 linguiJS，它有望使它变得更容易，但我找不到如何将它与 create-react-app 一起使用的示例。我也不确定在一个模块中同时使用格式(数字等)、复数和翻译是个好主意……我更愿意使用单独的库……

请分享您的想法。在 React 应用程序中获得 i18n 的最佳(最简单/最漂亮)方法是什么。

谢谢

Answer 1

使用 redux 只需使用两个提供程序(如果不使用没有提供程序的 react-i18next - 我更喜欢):

export default function App({ store }) {
  return (
    <I18nextProvider i18n={i18n}>
      <Provider store={store}>
        <YourRootComponent />
      </Provider>
    </I18nextProvider>
  );
}

并在您的组件中编写 translate hoc 和 redux connect:

export default compose(
  translate('namespace', { wait: true }),
  connect(mapStateToProps, mapDispatchToProps),
)(YourComponent);