2017-02-19 3 views
0

を使用して構築したReactアプリがあります。これはreact-routerです。 npm startを使用してテスト開発ビューを開くと、すべて正常に動作します。しかし、私がアプリを構築するときには、homepageのフィールドをpackage.jsonに設定しても、私が得られるのはreact-empty: 1コメントの#root divです。npm開始時にcreate-react-appアプリケーションがレンダリングされますが、npmビルドではreact-empty:1が表示されます

index.jsコンポーネントがそうのようになります。

ReactDOM.render(
    (<Router history={browserHistory}> 
     <Route path="/" component={App}> 
      <IndexRoute component={Home} /> 
      <Route path="/news" component={News} /> 
      <Route path="/current" component={Current} /> 
      <Route path="/previous" component={Previous} /> 
      <Route path="/about" component={About} /> 
      <Route path="/enter" component={Enter} /> 
      <Route path="/login" component={Login} /> 
      <Route path="/profile" component={Profile} /> 
     </Route> 
    </Router>), 
    document.querySelector('#root') 
); 

あなたは何が起こっているのかを把握するために、任意のより多くのコードを参照する必要がある場合は私に知らせてください。繰り返すだけで、何も表示されるエラーはありません。npm testまたはアプリのビルドコピーにあります。

+0

にホームページとして与えてくれたものを取るのでしょうか?なぜあなたはそのようなフィールドを追加しましたか? – kbariotis

+0

@kbariotisそれは、 'create-react-app'が相対パスに格納されたアセットに関してどのように動作するのかということです。あなたは私が話している技術に慣れていますか? – furkle

+1

ドキュメントごとに@kbariotis:デフォルトでは、Create React Appは、あなたのアプリがサーバールートでホストされていると仮定してビルドを作成します。これを無効にするには 、例えば、あなたのpackage.jsonでホームページを指定します。 '「ホームページ」:「http://mywebsite.com/relativepath」' このアプリは正しくへのルートパスを推測反応作成できるようになります生成されたHTMLファイルで使用します。 – furkle

答えて

1

これは、相対パスがhomepageの場合、package.jsonとルートの定義に問題があります。

Routerは、nullというレンダリングが必要な場合は、<!-- react-empty: 1 -->のようにレンダリングされます。

これは、セットRoute path="/"を設定しました。これは、ホームページの相対パスと一致する必要があります。あなたは

<Route path=process.env.PUBLIC_URL component={App}> 

にこれを変更することができ

これは、あなたが「`package.json`に` homepage`フィールド」とはどういう意味ですかpackage.json

関連する問題