2016-11-01 32 views
0

私は主にルート登録のための次のコードを持っている(main.tsx)エントリポイントを尊重しません。リアクト - ルータがディープリンク

import * as React from "react"; 
import * as ReactDOM from "react-dom"; 
import { browserHistory, IndexRoute, Route, Router } from "react-router"; 

import { About } from "../about/about"; 
import { Home } from "../home/home"; 

ReactDOM.render(
    <Router history={browserHistory}> 
     <Route path="/" component={Home}> 
     </Route> 
     <Route path="/about/:id" component={About}> 
     </Route> 
    </Router>, 
    document.getElementById("main") 
); 

Iまた、エントリ、出力に次のコードを持っており、私webpack.config.jsファイル内devServer:

module.exports = { 
    entry: { 
     main: "./wwwroot/common/main.tsx", // Starting point of linking/compiling Typescript and dependencies, will need to add separate entry points in case of not deving SPA 
     common: [ "q", "react", "react-dom", "react-router" ] // All of the "chunks" to extract and place in common file for faster loading of common libraries between pages 
    }, 
    output: { 
     path: "./dist/", // Where we want to host files in local file directory structure 
     publicPath: "/", // Where we want files to appear in hosting (eventual resolution to: https://localhost:4444/) 
     filename: "[name].js", // What we want end compiled app JS file to be called 
    }, 

    devServer: { 
     contentBase: "./dist", // Copy and serve files from dist folder 
     port: 4444, // Host on localhost port 4444 
     https: true, // Enable self-signed https/ssl cert debugging 
     colors: true, // Enable color-coding for debugging (VS Code does not currently emit colors, so none will be present there) 
     historyApiFallback: { 
      index: "index.html" 
     } 
    }, 

私が直接、またはリフレッシュ経由で/について/ uniqueGuidHereにアクセスしようとするたびに、私が受け取ることのすべては、すべての画像ファイルだけでなく、出力の共通のために(404エラーです。 jsファイルとmain.jsファイル)。追加のルーティングコードは、他の.tsxファイルには存在しません。私はリンクを持っています(それらの終わりにguidのconcat'dがあります)。何か不足していますか?反応ルータとの深いリンクを可能にするために何か他のものが必要ですか?

+0

FYI「index.htmlには、」ディレクトリ「./wwwroot/」に存在するとして、 –

答えて

0

あなたもこの問題に遭遇した人のために、私は解決策を見つけました(私の問題では少なくとも)。 index.htmlファイルには、相対パス(深いパスではなく)があることが判明しました。

たとえば、 "main.js"の "script src"を "./main.js"から "/main.js"に変更すると、(webpack-dev-serverを使用して提供されるように)作業を開始しました。さらに読書のための

ソースはここで見つけることができます:https://github.com/reactjs/react-router-tutorial/tree/master/lessons/10-clean-urls

関連する問題