如何使用react-intl v2 + webpack加载语言环境文件?

时间:2016-03-16 12:29:00

标签: reactjs internationalization react-redux react-intl

我有一个设置来使用webpack来管理我的所有资产。它工作正常。现在我计划使用react-intl版本2来支持多种语言。

我已设法在包' react-intl'中定义组件。工作,

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<video width="400" controls >
              <source src="mov_bbb.mp4" id="video_here">
            Your browser does not support HTML5 video.
          </video>


 <input type="file" name="file[]" class="file_multi_video" accept="video/*">

但我无法弄清楚通过webpack加载语言环境文件的正确方法是什么,并在组件中引用它们。由于该软件包最近破解了升级,因此没有太多关于它的文档。维基页面现在是空的

https://github.com/yahoo/react-intl/wiki

我想知道这样做的正确方法是什么?

1 个答案:

答案 0 :(得分:0)

xiopang, 我刚刚编写了一个基于react-intl v2的翻译示例的webpack插件。希望它适合您:https://gist.github.com/marr/95f7a8a3f5529e7e668048548198b9eb

webpack配置插件然后看起来像:

new TranslateWebpackPlugin(),
new HtmlWebpackPlugin({
  template: 'index.hbs', // Load a custom template
  inject: 'body', // Inject all scripts into the body
  chunks: [ 'app' ],
  app: true
}),

和index.hbs:

&#13;
&#13;
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <script>
      window.App = <%= htmlWebpackPlugin.options.app %>
    </script>
  </head>
  <body>
    <div id="app"></div>
  </body>
</html>
&#13;
&#13;
&#13;