[解決済み】Uncaught ReferenceError。Reactが定義されていない
質問
を使って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フレームワークを外部にロードすることです(そうすれば
{コード
が存在します)。
関連
-
[解決済み】node.js TypeError: path must be absolute or specify root to res.sendFile [JSONのパースに失敗しました]。
-
[解決済み】別のjsファイル内でJavaScriptの関数を呼び出す
-
[解決済み] とは何ですか! (not not)演算子とは何ですか?
-
[解決済み] URLを新しいタブで開く(新しいウィンドウではない)
-
[解決済み] JavaScriptで変数が存在するか(定義されているか/初期化されているか)をチェックする
-
[解決済み] Reactルータを使ったプログラムによるナビゲーション
-
[解決済み] React JSX内のループ
-
[解決済み] Reactのこの3つの点は何をするところなのでしょうか?
-
[解決済み] React NativeとReactの違いは何ですか?
-
[解決済み] Node.js上のクライアント。Uncaught ReferenceError: require は定義されていません。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】React Js: Uncaught (in promise) SyntaxError: 位置 0 の JSON で予期しないトークン < が発生しました。
-
[解決済み】TypeError: 'undefined'はオブジェクトではありません。
-
[解決済み] jQueryで、ユーザーがそのフィールドを編集している間、テキストフィールドの最初の文字を大文字にするにはどうすればよいですか?
-
[解決済み】SecurityError: オリジンを持つフレームがクロスオリジンフレームにアクセスするのをブロックした
-
[解決済み】最大呼び出しスタックサイズ超過エラーとその修正方法とは?
-
[解決済み] エラー。モジュールhtmlが見つからない
-
[解決済み】React-Routerの子が1つしかない。
-
[解決済み】DOMException: サポートされているソースが見つからなかったため、読み込みに失敗しました。
-
[解決済み】PhantomJS 2.1.1を使用してReactJSアプリケーションをレンダリングできない理由とは?
-
[解決済み】SyntaxError: 期待された式が、'<'を得た。