react, i18n, redux and react router configuration

Question

我有一个简单的(目前(使用react-router和redux的应用程序，我想为它添加国际化功能。

我已经react-i18next安装了 npm 包，并且能够安装和运行提供的示例。我已将适当的导入添加到我自己的应用程序中，并将 i18n 标记添加到根渲染方法中。

当我将 I18nextProvider 标记添加到呈现方法时，出现错误

找不到模块"反应">

这不是特别有用，特别是因为如果我删除标签，反应应用程序运行良好。

我使用的渲染方法是：

import React from 'react'
import ReactDOM from 'react-dom'    
....    
ReactDOM.render(
  <I18nextProvider i18n={ i18n }>
  <Provider store={store}>
    <div>
      <Router history={history}>
        <Route path="/" component={App}>
          <IndexRoute component={DashboardIndex}/>
          <Route path="about" component={About}/>
          <Route path="collectors" component={Collectors}/>
        </Route>
      </Router>
      <DevTools />
    </div>
  </Provider>
  </I18nextProvider>,
  document.getElementById('app')

编辑：我已经使用 yo 反应生成器启动了一个空白应用程序，它给出了同样的问题，所以我只能假设这个问题与 webpack 构建有关

我对 react/redux 等人很陌生，但在互联网上没有很多帮助的情况下，非常感谢任何帮助。

全栈跟踪为：

未捕获的错误：找不到模块"反应"o @ index.js？0f21：1(匿名函数( @ index.js？0f21：1r.4.react @ index.js？0f21：1o @ index.js？0f21：1(匿名函数( @ index.

JS？0F21：1R.2../I18nextProvider @ index.js？0f21：1o @ index.js？0f21：1e @ index.js？0f21：1(匿名函数( @ index.js？0f21：1c @ index.js？0f21：1(匿名函数( @ index.js？0f21：1(匿名( function( @ app.js：4127__webpack_require__ @ app.js：535fn @ app.js：76(匿名功能( @ VM91841：35(匿名功能( @ index.js？9552：67(匿名函数( @ index.js？9552：67(匿名( function( @ app.js：1024__webpack_require__ @ app.js：535fn @ app.js：76(匿名函数( @ app.js：567__webpack_require__ @ app.js：535(匿名函数( @ app.js：558(匿名函数( @ 应用.js：561 客户端？8a21：22 [WDS] 热模块更换已启用。

Answer 1

您是否需要对具有

ReactDOM.render(
  <I189nextProvider i18n={ i18n }>
  <Provider store={store}>
    <div>
      <Router history={history}>
        <Route path="/" component={App}>
          <IndexRoute component={DashboardIndex}/>
          <Route path="about" component={About}/>
          <Route path="collectors" component={Collectors}/>
        </Route>
      </Router>
      <DevTools />
    </div>
  </Provider>
  </I189nextProvider>,
  document.getElementById('app')

如果没有，你有问题...所有 jsx 都转换为 React.createComponent(...(

不需要 React 将导致捆绑错误。

Answer 2

我从来没有从技术角度深入了解这个问题，所以重构为使用 react-intl 来满足我的国际化需求。它也适用于我redux。