APIをRailsで、フロントエンドをReactで実装しています。
基本的にすべてのjsをnpmに寄せていますが、viewからreact用のヘルパーを利用したいため、
react-railsのgemは利用し、browserify-railsを利用しています。
ただし、react本体はbrowserifyでrequireしています。

package.json

{
  "name": "hoge",
  "version": "0.0.0",
  "description": "== README",
  "main": "index.js",
  "directories": {
    "test": "test"
  },
  "dependencies": {
    "bootstrap": "^3.3.7",
    "browserify": "~13.0.1",
    "browserify-incremental": "~3.1.1",
    "font-awesome": "^4.6.3",
    "i18n-js": "^1.0.0",
    "jquery": "2.2.4",
    "jquery-ujs": "^1.2.2",
    "react": "^15.3.1",
    "react-dom": "^15.3.1",
    "react-summernote": "^1.0.3",
    "reactify": "~1.1.1",
    "switchery": "0.0.2"
  },
  "devDependencies": {
    "j-toker": "0.0.10-beta3",
    "lodash": "~4.13.1"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git@bitbucket.org~"
  },
  "author": "",
  "license": "BSD-2-Clause"
}

Gemfile

source 'https://rubygems.org'
gem 'rails', '4.2.1'
...
gem 'browserify-rails'
gem 'react-rails', '~> 1.0'
...

application.js

//= require jquery/dist/jquery
//= require jquery-ujs
//= require bootstrap/dist/js/bootstrap
//= require i18n-js/i18n
//= require lodash/lodash
//= require switchery
//= require_tree .

components.js

//= require_self
//= require react_ujs
//= require_tree ./components

// NOTE React 本体は browserifyでrequireする
window.React = require('react');
window.ReactDOM = require('react-dom');

new.html.slim

#app
  = react_component('HogeHoge', authenticity_token: form_authenticity_token)

new.jsx

var HogeHoge = React.createClass({
  ...
  render: function() {
    <form className='pattern1' encType='multipart/form-data'>
    </form>
  );
})

ここまでは正常に動いていますが、
以下の通り、new.jsxの冒頭で、browserifyで外部ライブラリの何かしらをrequireをすると(僕の場合はreact-summernoteをrequire)エラーが発生します。
https://www.npmjs.com/package/react-summernote

new.jsx

var ReactSummernote = require('react-summernote');
var HogeHoge = React.createClass({
  render: function() {
    ...
    <form className='pattern1' encType='multipart/form-data'>
      <ReactSummernote
       value="Default value"
       options={{
         lang: 'ja-JP',
         height: 350,
         dialogsInBody: true,
         toolbar: [
           ['style', ['style']],
           ['font', ['bold', 'underline', 'clear']],
           ['fontname', ['fontname']],
           ['para', ['ul', 'ol', 'paragraph']],
           ['table', ['table']],
           ['insert', ['link', 'picture', 'video']],
           ['view', ['fullscreen', 'codeview']]
         ]
       }}
       onChange={this.handleInputChange}
      />
    </form>
  );
})

Uncaught ReferenceError: HogeHoge is not defined
ページをロードし終わると、このエラーが発生し、描画はされません。

そもそもjs周辺の知識が足りないこと、あるいはreactを理解できていないこと、
が問題解決できない理由な気はしていますが、
何かお気づきになる点がありましたら、ご指摘頂けますと幸いです。

何卒よろしくお願い致します。