Всем привет
Решил новый проект сделать на собственном вебпаке и почему-то начал ломаться роутер при обновлении. То есть, по клике на Link он рендерит компонент, но если я обновлю страницу, то получаю
Cannot GET /login
Вебпак:
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
devtool: 'eval-source-map',
entry: [
'webpack-dev-server/client?http://localhost:3000',
'webpack/hot/only-dev-server',
'react-hot-loader/patch',
path.join(__dirname, 'client/index.js')
],
output: {
path: path.join(__dirname, '/dist/'),
filename: '[name].js',
publicPath: '/'
},
plugins: [
new HtmlWebpackPlugin({
template: 'client/index.html',
inject: 'body',
filename: 'index.html'
}),
new webpack.optimize.OccurrenceOrderPlugin(),
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin(),
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('development')
})
],
module: {
loaders: [
{
test: /\.js?$/,
exclude: /node_modules/,
loader: "babel-loader"
},
{
test: /\.json?$/,
loader: 'json'
},
{
test: /\.scss$/,
loader: 'style!css!sass?modules&localIdentName=[name]---[local]---[hash:base64:5]'
},
{ test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "url-loader?limit=10000&minetype=application/font-woff" },
{ test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/, loader: "file-loader" }
]
}
};
Роутер :
index.js
ReactDOM.render(<BrowserRouter><App/></BrowserRouter>, document.getElementById("root"));
App.js :
<Switch>
<Route exact path='/' render={() => <div><Header/><Map/></div>}/>
<Route exact path='/login' component={Login}/>
</Switch>