未捕获的引用错误：未定义 React

javascript reactjs ruby-on-rails

2022-08-30 01:58:57

我正在尝试使用本教程使 ReactJS 与 rails 一起工作。我收到此错误：

Uncaught ReferenceError: React is not defined

但是我可以在浏览器控制台
中访问 React 对象，我还添加了 public/dist/turbo-react.min.js如这里所述，并在应用程序中添加了一行.js如本答案中所述，没有运气。此外，
还会给出错误：//= require componentsvar React = require('react')
Uncaught ReferenceError: require is not defined

任何人都可以建议我如何解决这个问题吗？

[编辑1]
源代码参考：
这是我的文件：comments.js.jsx

var Comment = React.createClass({
  render: function () {
    return (
      <div className="comment">
        <h2 className="commentAuthor">
          {this.props.author}
        </h2>
          {this.props.comment}
      </div>
      );
  }
});

var ready = function () {
  React.renderComponent(
    <Comment author="Richard" comment="This is a comment "/>,
    document.getElementById('comments')
  );
};

$(document).ready(ready);

这是我的：index.html.erb

<div id="comments"></div>

答案 1

如果你使用的是 Babel 和 React 17，你可能需要在配置中添加 “runtime”： “automatic”。

 {
     "presets": [
         "@babel/preset-env",
        ["@babel/preset-react", {"runtime": "automatic"}]
     ]
 }

答案 2

当我使用webpack构建我的javascript时，我能够重现这个错误，我的以下块在我的：webpack.config.json

externals: {
    'react': 'React'
},

上面的这个配置告诉webpack不要通过加载npm模块来解决，而是期望一个名为的全局变量（即在对象上）。解决方案是要么删除这段配置（所以 React 将与您的 javascript 捆绑在一起），要么在执行此文件之前在外部加载 React 框架（以便存在）。require('react')windowReactwindow.React