1. ホーム
  2. javascript

[解決済み】Uncaught ReferenceError。Reactが定義されていない

2022-01-27 09:20:18

質問

を使ってReactJSをrailsで動作させようとしています。 これ チュートリアルをご覧ください。このエラーが発生します。


Uncaught ReferenceError: React is not defined

しかし、ブラウザのコンソールでReactオブジェクトにアクセスすることができます。 画像
も追加しました。 public/dist/turbo-react.min.js を記載しました。 こちら を追加し、さらに {コード の行を、application.jsに記述しています。 この回答で を実行しても、うまくいきません。さらに
//= require components がエラーになる。
var React = require('react')

どなたか解決策を提案していただけませんか?

[EDIT 1]
参考となるソースコード
これは私の Uncaught ReferenceError: require is not defined ファイルを作成します。

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); :

{{コード

解決するには?

このエラーを再現できたのは、webpackを使ってjavascriptをビルドする際に、以下のチャンクを私の index.html.erb:

{{コード

この設定により、webpackは {コード を読み込むのではなく、グローバル変数 (すなわち <div id="comments"></div> という名前の webpack.config.json. 解決策は、この設定部分を削除するか(そうすればReactはあなたのJavaScriptにバンドルされます)、このファイルが実行される前にReactフレームワークを外部にロードすることです(そうすれば {コード が存在します)。