2016-07-18 4 views
0

내 webpack 구성은 index.html이 제공되는 HTMLWebpackPlugin을 사용합니다.react-router 및 HTMLWebpackPlugin이있는 익스프레스 상태 404

plugins: [ 
    new HTMLWebpackPlugin({ 
    title: 'My App', 
    favicon: path.join(__dirname, "../src/public/fav.ico") 
    }) 
] 

나는이이 같은 index.html을 생성 노출 해요 : 나는, 클라이언트 측, 반응 라우터를 사용하고

app.use('/', express.static(__dirname)); 

을, 여기 내 경로는 다음과 같습니다

export default (
    <Route path="/" component={App}> 
    <Route path="home" component={HomePage} /> 
    </Route> 
) 

http://localhost:1337/에 액세스하는 것은 올바르게 작동하고 내 "App"구성 요소를 올바르게 표시하지만 http://localhost:1337/home에 액세스하려고하면 경로가/home 인 SERVER-SIDE 때문에 404가 표시됩니다. 물론

나는 나의 server.js에 추가하는 경우 :

app.get('/home', function(req, res) { 
    res.json({name: 'john'}); 
}) 

호출 http://localhost:1337/home 반환 적절한 JSON 객체입니다.

무엇이 누락 되었습니까?

답변

-1

나는 보통 대략 다음과 같이 기본 경로를하고있는 중이 야 : 경로 이름을 지정할 때

let React = require('react'); 

let Router = require('react-router'); 
let DefaultRoute = Router.DefaultRoute(); 
let Route = Router.Route(); 


<Route name="app" path="/" handler={require("./components/App"}> 
    <DefaultRoute handler={require("./components/HomePage"} /> 
    <Route name="anotherSite" handler={require("./components/anotherSite"} /> 
    <Route name="about-us" handler={require("./components/About"} /> 
</Route> 

특정 경로를 사용할 필요가 없습니다. 관습에 따라 경로 이름은 의도적으로 이름이 아닌 다른 경로로 경로 옵션을 만들 때를 제외하고는 경로와 같습니다.

그래도 도움이되지 않는 경우 추가 정보를 질문에 추가하십시오.

+0

아니요, 불행히도 내 문제와 관련이 없습니다. 내 문제는 브라우저가 중첩 된 경로 (여기서는/home)로 SERVER를 호출하려고 시도하는 것이고 아무것도 찾지 않고 404를 얻지 못한다는 것입니다. – Max

+0

나는 경로를 구성하는 다른 방법을 원했습니다. 앱이로드를 완료하면 일반적으로 표현은 앱과 관련이 없어야합니다. 이상한 부분이므로 반응 부분에서 오류가 발생할 것으로 예상됩니다. 네가 우리에게 준 것은 길 뿐이야. 그 때문에 나는 더 많은 정보를 요구했고 문제 해결을 위해 다른 라우팅 접근법을 보여 주려고 노력했다. – Ahnzh