Ruby on rails 除chrome浏览器外，未定义React

我正在使用rails 4应用程序。使用react模块的唯一方法是通过。一切都很好，没有问题。一直以来，我都在使用chrome版本47.0.2526.106（64位）

使用任何其他浏览器，我得到

未定义的React

奇怪的是，如果我在

application.js

中

/=require-react

，它会删除消息，但我肯定会要求react两次，这会导致其他问题，因为

components.js

中需要react，而

react=require（'react'）

简而言之，我使用的是
react-rails-gem
和
npm-react
。我只需要使用react的npm版本和react rails的格式

任何关于为什么chrome工作没有任何问题而不是其他问题的解决方案（firefox、safari）。我没有试过explorer

application.js:

//= require jquery
//= require jquery_ujs
//= require foundation
//= require moment
//= require ckeditor/init
//= require components
//= require react-rails-hot-loader
//= require_tree .

...

//= require_self
//= require react_ujs

React = require('react');
ReactDOM = require('react-dom');
LinkedStateMixin = require('react-addons-linked-state-mixin');

...

//error stack:
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({"/Users/sylar/Sites/rails/simple-app/app/assets/javascripts/components/_stream_0.js":[function(require,module,exports){
var Dashboard = React.createClass({ 
  displayName: "Dashboard",

  render: function () {
    return React.createElement(
      "div",
      null,
      "Hi"
    );
  }

});
module.exports = Dashboard;
},{}]},{},["/Users/sylar/Sites/rails/simple-app/app/assets/javascripts/components/_stream_0.js"]);

{
  "name": "simple-app",
  "dependencies": {
    "browserify": "~> 10.2.4",
    "browserify-incremental": "^3.0.1",
    "react": "^0.14.3",
    "react-addons-linked-state-mixin": "^0.14.3",
    "react-dom": "^0.14.3",
    "react-dropzone": "^3.3.0",
    "react-select": "^1.0.0-beta7",
    "reactify": "^1.1.1"
  },
  "engines": {
    "node": ">= 0.10"
  }
}

source 'https://rubygems.org'
ruby '2.2.3'
gem 'rails', '4.2.4'
gem 'pg'
group :production do
  gem 'rails_12factor'
  gem 'puma'
end

gem 'sass-rails', '~> 5.0'
gem 'country_select'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.1.0'
gem 'jquery-rails'
gem 'jbuilder', '~> 2.0'
gem 'foundation-rails'
gem 'momentjs-rails', '2.10.3'
gem 'react-rails', '~> 1.4.2'
gem "browserify-rails"
gem 'react-rails-hot-loader'
gem 'sidekiq', '4.0.1'
gem 'sinatra', require: false
gem 'slim'
gem 'ckeditor', '4.1.2'
gem 'devise', '3.5.2'
gem 'paperclip', '4.3.1'
gem 'aws-sdk', '< 2.0'

gem 'kaminari', '0.16.3'

gem 'awesome_print', :require => 'ap'
gem 'sdoc', '~> 0.4.0', group: :doc
gem 'stripe', '1.27.2'
# Use Figaro to hide secret keys
gem 'figaro', '1.1.1'
gem 'friendly_id', '5.1.0'

group :development, :test do
  gem 'byebug'
  gem 'web-console', '~> 2.0'
  gem 'spring'
  gem 'better_errors'
end

components.js:

//= require jquery
//= require jquery_ujs
//= require foundation
//= require moment
//= require ckeditor/init
//= require components
//= require react-rails-hot-loader
//= require_tree .

...

//= require_self
//= require react_ujs

React = require('react');
ReactDOM = require('react-dom');
LinkedStateMixin = require('react-addons-linked-state-mixin');

...

//error stack:
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({"/Users/sylar/Sites/rails/simple-app/app/assets/javascripts/components/_stream_0.js":[function(require,module,exports){
var Dashboard = React.createClass({ 
  displayName: "Dashboard",

  render: function () {
    return React.createElement(
      "div",
      null,
      "Hi"
    );
  }

});
module.exports = Dashboard;
},{}]},{},["/Users/sylar/Sites/rails/simple-app/app/assets/javascripts/components/_stream_0.js"]);

{
  "name": "simple-app",
  "dependencies": {
    "browserify": "~> 10.2.4",
    "browserify-incremental": "^3.0.1",
    "react": "^0.14.3",
    "react-addons-linked-state-mixin": "^0.14.3",
    "react-dom": "^0.14.3",
    "react-dropzone": "^3.3.0",
    "react-select": "^1.0.0-beta7",
    "reactify": "^1.1.1"
  },
  "engines": {
    "node": ">= 0.10"
  }
}

source 'https://rubygems.org'
ruby '2.2.3'
gem 'rails', '4.2.4'
gem 'pg'
group :production do
  gem 'rails_12factor'
  gem 'puma'
end

gem 'sass-rails', '~> 5.0'
gem 'country_select'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.1.0'
gem 'jquery-rails'
gem 'jbuilder', '~> 2.0'
gem 'foundation-rails'
gem 'momentjs-rails', '2.10.3'
gem 'react-rails', '~> 1.4.2'
gem "browserify-rails"
gem 'react-rails-hot-loader'
gem 'sidekiq', '4.0.1'
gem 'sinatra', require: false
gem 'slim'
gem 'ckeditor', '4.1.2'
gem 'devise', '3.5.2'
gem 'paperclip', '4.3.1'
gem 'aws-sdk', '< 2.0'

gem 'kaminari', '0.16.3'

gem 'awesome_print', :require => 'ap'
gem 'sdoc', '~> 0.4.0', group: :doc
gem 'stripe', '1.27.2'
# Use Figaro to hide secret keys
gem 'figaro', '1.1.1'
gem 'friendly_id', '5.1.0'

group :development, :test do
  gem 'byebug'
  gem 'web-console', '~> 2.0'
  gem 'spring'
  gem 'better_errors'
end

错误堆栈：

//= require jquery
//= require jquery_ujs
//= require foundation
//= require moment
//= require ckeditor/init
//= require components
//= require react-rails-hot-loader
//= require_tree .

...

//= require_self
//= require react_ujs

React = require('react');
ReactDOM = require('react-dom');
LinkedStateMixin = require('react-addons-linked-state-mixin');

...

//error stack:
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({"/Users/sylar/Sites/rails/simple-app/app/assets/javascripts/components/_stream_0.js":[function(require,module,exports){
var Dashboard = React.createClass({ 
  displayName: "Dashboard",

  render: function () {
    return React.createElement(
      "div",
      null,
      "Hi"
    );
  }

});
module.exports = Dashboard;
},{}]},{},["/Users/sylar/Sites/rails/simple-app/app/assets/javascripts/components/_stream_0.js"]);

{
  "name": "simple-app",
  "dependencies": {
    "browserify": "~> 10.2.4",
    "browserify-incremental": "^3.0.1",
    "react": "^0.14.3",
    "react-addons-linked-state-mixin": "^0.14.3",
    "react-dom": "^0.14.3",
    "react-dropzone": "^3.3.0",
    "react-select": "^1.0.0-beta7",
    "reactify": "^1.1.1"
  },
  "engines": {
    "node": ">= 0.10"
  }
}

source 'https://rubygems.org'
ruby '2.2.3'
gem 'rails', '4.2.4'
gem 'pg'
group :production do
  gem 'rails_12factor'
  gem 'puma'
end

gem 'sass-rails', '~> 5.0'
gem 'country_select'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.1.0'
gem 'jquery-rails'
gem 'jbuilder', '~> 2.0'
gem 'foundation-rails'
gem 'momentjs-rails', '2.10.3'
gem 'react-rails', '~> 1.4.2'
gem "browserify-rails"
gem 'react-rails-hot-loader'
gem 'sidekiq', '4.0.1'
gem 'sinatra', require: false
gem 'slim'
gem 'ckeditor', '4.1.2'
gem 'devise', '3.5.2'
gem 'paperclip', '4.3.1'
gem 'aws-sdk', '< 2.0'

gem 'kaminari', '0.16.3'

gem 'awesome_print', :require => 'ap'
gem 'sdoc', '~> 0.4.0', group: :doc
gem 'stripe', '1.27.2'
# Use Figaro to hide secret keys
gem 'figaro', '1.1.1'
gem 'friendly_id', '5.1.0'

group :development, :test do
  gem 'byebug'
  gem 'web-console', '~> 2.0'
  gem 'spring'
  gem 'better_errors'
end

gemfile:

//= require jquery
//= require jquery_ujs
//= require foundation
//= require moment
//= require ckeditor/init
//= require components
//= require react-rails-hot-loader
//= require_tree .

...

//= require_self
//= require react_ujs

React = require('react');
ReactDOM = require('react-dom');
LinkedStateMixin = require('react-addons-linked-state-mixin');

...

//error stack:
(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({"/Users/sylar/Sites/rails/simple-app/app/assets/javascripts/components/_stream_0.js":[function(require,module,exports){
var Dashboard = React.createClass({ 
  displayName: "Dashboard",

  render: function () {
    return React.createElement(
      "div",
      null,
      "Hi"
    );
  }

});
module.exports = Dashboard;
},{}]},{},["/Users/sylar/Sites/rails/simple-app/app/assets/javascripts/components/_stream_0.js"]);

{
  "name": "simple-app",
  "dependencies": {
    "browserify": "~> 10.2.4",
    "browserify-incremental": "^3.0.1",
    "react": "^0.14.3",
    "react-addons-linked-state-mixin": "^0.14.3",
    "react-dom": "^0.14.3",
    "react-dropzone": "^3.3.0",
    "react-select": "^1.0.0-beta7",
    "reactify": "^1.1.1"
  },
  "engines": {
    "node": ">= 0.10"
  }
}

source 'https://rubygems.org'
ruby '2.2.3'
gem 'rails', '4.2.4'
gem 'pg'
group :production do
  gem 'rails_12factor'
  gem 'puma'
end

gem 'sass-rails', '~> 5.0'
gem 'country_select'
gem 'uglifier', '>= 1.3.0'
gem 'coffee-rails', '~> 4.1.0'
gem 'jquery-rails'
gem 'jbuilder', '~> 2.0'
gem 'foundation-rails'
gem 'momentjs-rails', '2.10.3'
gem 'react-rails', '~> 1.4.2'
gem "browserify-rails"
gem 'react-rails-hot-loader'
gem 'sidekiq', '4.0.1'
gem 'sinatra', require: false
gem 'slim'
gem 'ckeditor', '4.1.2'
gem 'devise', '3.5.2'
gem 'paperclip', '4.3.1'
gem 'aws-sdk', '< 2.0'

gem 'kaminari', '0.16.3'

gem 'awesome_print', :require => 'ap'
gem 'sdoc', '~> 0.4.0', group: :doc
gem 'stripe', '1.27.2'
# Use Figaro to hide secret keys
gem 'figaro', '1.1.1'
gem 'friendly_id', '5.1.0'

group :development, :test do
  gem 'byebug'
  gem 'web-console', '~> 2.0'
  gem 'spring'
  gem 'better_errors'
end

源代码'https://rubygems.org'
ruby“2.2.3”
gem“rails”、“4.2.4”
宝石“pg”
小组：生产部
gem“rails_12factor”
宝石“美洲狮”
结束
gem'sass-rails'，“~>5.0”
gem“国家/地区选择”
gem'uglifier'，'>=1.3.0'
gem“咖啡轨”，“~>4.1.0”
gem'jqueryrails'
gem'jbuilder'，“~>2.0”
gem“基础轨道”
gem“momentjs rails”、“2.10.3”
gem'react rails'，“~>1.4.2”
gem“browserify rails”
gem“反应rails热加载程序”
宝石“sidekiq”，“4.0.1”
宝石“sinatra”，要求：假
宝石“苗条”
gem'ckeditor'，'4.1.2'
创业板‘设计’、‘3.5.2’
宝石“回形针”，“4.3.1”
gem“aws sdk”，“<2.0”
宝石'kaminari'，'0.16.3'
gem'awesome_print'，：require=>ap'
gem'sdoc'，'~>0.4.0'，组：：doc
宝石“条纹”，“1.27.2”
#使用费加罗隐藏密钥
宝石“费加罗”，“1.1.1”
gem“友好id”，“5.1.0”
小组：开发，：测试
宝石“比伯”
gem“web控制台”，“~>2.0”
宝石“春天”
gem“更好的错误”
结束
2想法：在
components.js
中，我认为您希望使用
var React=require（'React'）。在
dashboard.jsx
中，您需要
var React=require（'React'）也是。我自己没有使用过
react rails
，但这是在网页设置中要做的。添加您现在所说的内容会使Chrome抱怨react没有定义。