hereの Erik Rasmussen のスターターキットに基づいた React アプリがあります。
このアプリは、React Router と Redux を使用して非常にうまく機能します。
私のRailsアプリはかなり古いので、アプリケーションを埋め込むアイデアは、indexアクションがiFrameをレンダリングする別のコントローラーを持つことです。これは、同じコントローラーshowアクションからコンテンツをロードします。
したがって、Rails アプリのレイアウトに固執し、React アプリのマークアップを変更なしでレンダリングすることができます。
経由でアプリをトランスパイルした後
$> npm run build
main -.js ファイルと main -.css ファイルを Rails アプリにコピーして、そこから配信できるようにします。
その後、次の方法で React アプリを起動します。
$> npm run start
curl を介して開始ページをリクエストします。curl の出力は私のshowerb テンプレートに入ります。内部では、メインの JS と CSS が読み込まれる URL を変更します。
今ページをリクエストするとindex、iFrame がそのコンテンツをロードし、アプリは初期化されているように見えますが、まったく機能しません。レンダリングされたコンテンツは表示されますが、リンクをクリックすると Rails のルーティング エラーが発生します。そのため、クリックは React によって傍受されていないようです。
私は実行を追跡しようとしましたが、コードのデバッグを終了しましたclient.js。適切な引数を受け取るように見えReactDOM.renderます。つまり、レンダリングする適切な外観のコンポーネント、ストア、さらには宛先要素があります。
現在、コンソールに次のエラーが表示されます。
Uncaught ReferenceError: _classCallCheck is not defined
初期データをマークアップに埋め込むスターターキットの少し古いバージョンを使用していますが、_classCallCheck が React アプリで機能するのに、Rails に埋め込むと機能しなくなる理由を理解できませんでした。
スターターキットの最新バージョンでも動作しません。その場合、エラーはまったく発生しませんが、同じ動作をします。
Rails のバージョンが古いため、React Gem を使用できません。また、スターターキットがすぐに提供する機能の一部が必要なので、これを変更することもできません。
ヒントはありますか？