React 라우터 + webpack, 하위 라우터가 작동하지 않습니다.

내 라우터를 설정하고 기본/진입 점을 작동시키고 있습니다 (겉으로보기). 하위 경로를 추가하려고 할 때, 깨지는 것 같습니다. 나는 지금 꽤 똑바로 앞으로 설정합니다. 8080/테스트 :을 내가 localhost로 이동 그러나 때, 8080, 그것은 문제없이 첫 번째 경로를 제공합니다 :React 라우터 + webpack, 하위 라우터가 작동하지 않습니다.

ReactDOM.render(
<Provider store={store}> 
    <Router history={browserHistory} > 
     <Route path="/" component={comp1.Component}> 
      <Route path="test" component={comp2.Component} /> 
     </Route> 
    </Router> 
</Provider>, 
// eslint-disable-next-line no-undef 
document.getElementById('app') 
);

내가 로컬 호스트에 웹팩 dev에 서버를 실행하고 있습니다 : 나는 돌아 오는 + 반응 내 같은 외모를 렌더링 사용하고 , 나는 Cannot GET /test을 얻고있다.

내가 잘못 여기서 뭐하는 거지

var path = require('path'); 
var webpack = require('webpack'); 

module.exports = { 
    devtool: 'eval', 
    entry: [ 
    'webpack-dev-server/client?http://localhost:3000', 
    'webpack/hot/only-dev-server', 
    './client/app.jsx' 
    ], 
    output: { 
    path: path.join(__dirname, ''), 
    filename: 'bundle.js', 
    publicPath: '/' 
    }, 
    plugins: [ 
    new webpack.HotModuleReplacementPlugin(), 
    new webpack.optimize.DedupePlugin(), 
    new webpack.DefinePlugin({ 
     'process.env.NODE_ENV': JSON.stringify('production') 
    }), 
    new webpack.optimize.UglifyJsPlugin({ 
     compress: { 
     warnings: false 
     } 
    }) 
    ], 
    module: { 
    loaders: [{ 
     test: /\.jsx?$/, 
     exclude: /node_modules/, 
     loader: "babel-loader", 
     include: __dirname, 
     query: { 
     presets: [ 'es2015', 'react', 'react-hmre' ] 
     } 
    }] 
    } 
}

확실, 어떤 도움을 보내 주시기 바랍니다

여기 내 웹팩 설정입니다. 감사!

출처

2016-10-14 ajmajmajma

React Router는 HTML5 기록 API를 사용합니다. 즉, 404 응답은 /index.html을 제공해야합니다.

문서 mention how this works.

var server = new WebpackDevServer(compiler, { historyApiFallback: true });

출처

2016-10-15 12:49:25 spacek33z

다음 Node.js를 API를 사용할 때 CLI이 비로소 작동, 당신은 두 번째 매개 변수로이를 추가 할 필요가

devServer: { historyApiFallback: true }

참고 : 당신은 당신의 module.exports 객체에이를 추가해야 나는 그것을 추가하고/test에 가서, 더 이상 404를 제공하지 않지만, 여전히 나에게'component = {comp1.Component}'만을 보여주고있다. (테스트를 위해 지정한 것은 아니다.) 감사합니다! – ajmajmajma

경험이 아직 슬래시를 사용해야하므로 경로는'/ test' 여야합니다.이 답변을 고쳐 주면이 대답을 허용으로 표시 할 수 있습니까? – spacek33z

경로 변경은 작동하지 않습니다 어. 여전히 잘못된 구성 요소를 보여줍니다. – ajmajmajma

React 라우터 + webpack, 하위 라우터가 작동하지 않습니다.

답변

관련 문제