Gruntjs 在React组件上运行grunt browserify时出现分析错误

我只是在玩弄React，使用grunt和grunt browserify有一个基本的设置，但是我得到了一个解析错误。有人知道这个问题的解决方案吗？旁注-当我不使用react/jsx时，任务运行良好

有一个基本组成部分：

var HelloWorld = React.createClass({
  render: function(){
    return (
      <div>
        Hello World!
      </div>
    )
  }
});

React.render(<HelloWorld />, document.getElementById('app'));

---

HelloWorld类是

jsx

，因此grunt browserify需要使用transform选项将jsx转换为js

browserify: {
  dist: {
    options: {
      transform: [ require('grunt-react').browserify ] // <-- this one
    },
    client: {
      src: [assets/javascripts/components/**/*.js, assets/javascripts/app.js], // sources files
      dest: 'public/javascripts/app.js' // output file
    }
  }
}

browserify：{
地区：{
选项：{
transform:[require（'grunt-react'）.browserify]/我不同意Dhiraj的答案，但这导致我使用了reactify

browserify: {
  options: {
    transform: ['reactify'],
    extensions: ['.jsx'],
    debug: true
  },
  dist: {
    files: {
      'public/javascripts/app.js' : 
      [
        'assets/javascripts/components/**/*.jsx',
        'assets/javascripts/app.jsx'
      ]
    }
  }
},

您还可以为
grunt browserify
任务添加代码吗？在@DhirajBodicherlaOr中添加了代码，如果您需要es6转换，也可以使用“babelify”（它也支持jsx）。reactify速度更快。
browserify: {
  dist: {
    options: {
      transform: [ require('grunt-react').browserify ] // <-- this one
    },
    client: {
      src: [assets/javascripts/components/**/*.js, assets/javascripts/app.js], // sources files
      dest: 'public/javascripts/app.js' // output file
    }
  }
}

browserify: {
  options: {
    transform: ['reactify'],
    extensions: ['.jsx'],
    debug: true
  },
  dist: {
    files: {
      'public/javascripts/app.js' : 
      [
        'assets/javascripts/components/**/*.jsx',
        'assets/javascripts/app.jsx'
      ]
    }
  }
},