2016-03-24 2 views
2

チュートリアルの後、私はwebpackに私のバンドルをさせてもらいました。React.NET、Webpack - ReactDOMは未定義です(クライアント側)

@Html.React("Components.myComponent", 
      New With { 
       .initialData = Nothing 
      }) 

@Html.ReactInitJavaScript() 

これは正しくブラウザで私のコンポーネントが表示されますが、できるだけ早くクライアントが、私はエラーに'ReactDOM' is undefined

を得る引き継ぐように私は私がrequireにReactDOMを試してみましたnpm install react-dom --save-dev
を使用してreact-domをインストールしています、f IRST私の成分を含む.jsxのファイルで、その後、client.jsでのWebPACKから構築され、そのファイル:

//myComponent.jsx 
var React = require('react'); 
var ReactDOM = require('react-dom'); 

または

//client.js 
var ReactDOM = require('react-dom'); 
var Components = require('expose?Components!./src'); 

しかし、私はまだ同じエラーを取得しています。

私はjavascriptを直接私のWebPACKコンパイルクライアント上reactreact-domスクリプトを追加した場合、問題が消える:

//index.html 
<script src="https://www.facebook.com/react-0.14.0.min.js"></script> 
<script src="https://www.facebook.com//react-dom-0.14.0.min.js"></script> 
<script src="~/Scripts/webpack/build/client.bundle.js"></script> 

は、どのように私はWebPACKのが正しく、クライアント・バンドルにこれらのスクリプトを含めるように入手できますか?

EDIT

私は私のwebpack.config.jsで次externalsを持っていたが、それらを削除しても、違いを確認していないようです。私は推測

externals: { 
    // Use external version of React (from CDN for client-side, or 
    // bundled with ReactJS.NET for server-side) 
    react: 'React' 
} 

、見た目があるのででき使用CDNベースのスクリプトなので、多分私はこの1つをoverthinkingていますし、ちょうどCDN私の見解では、スクリプトを反応させるベースのままにする必要がありますか?

答えて

3

あなたclient.jsでグローバルreact-domを公開する必要がありますので、クライアント側をレンダリングするReactDOM変数にブラウザで利用できるようになります:

require("expose?ReactDOM!react-dom"); 
+0

うん、それはそれです!私はそれの周りに働いていたが、それは今感謝の多くを作る:) –