{"action":"opened","issue":{"url":"https://api.github.com/repos/webpack/webpack-dev-server/issues/491","repository_url":"https://api.github.com/repos/webpack/webpack-dev-server","labels_url":"https://api.github.com/repos/webpack/webpack-dev-server/issues/491/labels{/name}","comments_url":"https://api.github.com/repos/webpack/webpack-dev-server/issues/491/comments","events_url":"https://api.github.com/repos/webpack/webpack-dev-server/issues/491/events","html_url":"https://github.com/webpack/webpack-dev-server/issues/491","id":156915364,"number":491,"title":"historyApiFallback option doesn't work","user":{"login":"AndrejGajdos","id":1593758,"avatar_url":"https://avatars.githubusercontent.com/u/1593758?v=3","gravatar_id":"","url":"https://api.github.com/users/AndrejGajdos","html_url":"https://github.com/AndrejGajdos","followers_url":"https://api.github.com/users/AndrejGajdos/followers","following_url":"https://api.github.com/users/AndrejGajdos/following{/other_user}","gists_url":"https://api.github.com/users/AndrejGajdos/gists{/gist_id}","starred_url":"https://api.github.com/users/AndrejGajdos/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/AndrejGajdos/subscriptions","organizations_url":"https://api.github.com/users/AndrejGajdos/orgs","repos_url":"https://api.github.com/users/AndrejGajdos/repos","events_url":"https://api.github.com/users/AndrejGajdos/events{/privacy}","received_events_url":"https://api.github.com/users/AndrejGajdos/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":0,"created_at":"2016-05-26T06:44:43Z","updated_at":"2016-05-26T06:44:43Z","closed_at":null,"body":"I use [https://github.com/reactjs/react-router/blob/master/docs/guides/Histories.md#browserhistory](https://github.com/reactjs/react-router/blob/master/docs/guides/Histories.md#browserhistory) and `historyApiFallback` option is true in my config, but it doesn't work. After refreshing I got 404 error.\r\n\r\n**webpack.config.js**\r\n\r\n```\r\nvar webpack = require('webpack');\r\nvar merge = require('webpack-merge');\r\n\r\nconst TARGET = process.env.npm_lifecycle_event;\r\n\r\nvar common = {\r\n    cache: true,\r\n    debug: true,\r\n    entry: './src/script/index.jsx',\r\n    resolve: {\r\n        extensions: ['', '.js', '.jsx']\r\n    },\r\n    output: {\r\n        sourceMapFilename: '[file].map'\r\n    },\r\n    module: {\r\n        loaders: [\r\n            {\r\n                test: /\\.js[x]?$/,\r\n                loader: 'babel-loader',\r\n                exclude: /(node_modules)/\r\n            }\r\n        ]\r\n    },\r\n    plugins: [\r\n        new webpack.ProvidePlugin({\r\n            $: \"jquery\",\r\n            jQuery: \"jquery\"\r\n        })\r\n    ]\r\n};\r\n\r\nif(TARGET === 'dev' || !TARGET) {\r\n    module.exports = merge(common,{\r\n        devtool: 'eval-source-map',\r\n        devServer: {\r\n            historyApiFallback: true\r\n        },\r\n        output: {\r\n            filename: 'index.js',\r\n            publicPath: 'http://localhost:8090/assets/'\r\n        },\r\n        plugins: [\r\n            new webpack.DefinePlugin({\r\n                'process.env.NODE_ENV': JSON.stringify('dev')\r\n            })\r\n        ]\r\n    });\r\n}\r\n```\r\n\r\n**index.html**\r\n\r\n```\r\n<!DOCTYPE html>\r\n<html>\r\n    <head>\r\n        <meta http-equiv=\"Content-type\" content=\"text/html; charset=utf-8\"/>\r\n        <title>Test</title>\r\n    </head>\r\n    <body>\r\n        <div id=\"content\">\r\n            <!-- this is where the root react component will get rendered -->\r\n        </div>\r\n        <script src=\"http://localhost:8090/webpack-dev-server.js\"></script>\r\n        <script type=\"text/javascript\" src=\"http://localhost:8090/assets/index.js\"></script>\r\n    </body>\r\n</html>\r\n```\r\n\r\n**index.jsx**\r\n```\r\n\r\nimport React, {Component} from 'react';\r\nimport ReactDOM from 'react-dom';\r\nimport {Router, Route, useRouterHistory, browserHistory, Link} from 'react-router';\r\n\r\nclass Home extends Component{\r\n  constructor(props) {\r\n    super(props);\r\n  }\r\n\r\n  render() {\r\n      return <div>\r\n          I am home component\r\n          <Link to=\"/users\" activeClassName=\"active\">Users</Link>\r\n          <Link to=\"/products\" activeClassName=\"active\">Products</Link>\r\n        </div>;\r\n  }\r\n}\r\n\r\nclass Users extends Component{\r\n  constructor(props) {\r\n    super(props);\r\n  }\r\n\r\n  render() {\r\n      return <div> I am Users component </div>;\r\n  }\r\n}\r\n\r\nclass Products extends Component{\r\n  constructor(props) {\r\n    super(props);\r\n  }\r\n\r\n  render() {\r\n      return <div> I am Products component </div>;\r\n  }\r\n}\r\n\r\nReactDOM.render(\r\n    <Router history={browserHistory} onUpdate={() => window.scrollTo(0, 0)}>\r\n        <Route path=\"/\" component={Home}/>\r\n        <Route path=\"/users\" component={Users} type=\"users\"/>\r\n        <Route path=\"/products\" component={Products} type=\"products\"/>\r\n    </Router>\r\n    , document.getElementById('content'));\r\n```\r\n\r\n**package.json**\r\n\r\n```\r\n{\r\n  \"name\": \"test\",\r\n  \"version\": \"1.0.0\",\r\n  \"description\": \"\",\r\n  \"main\": \"index.jsx\",\r\n  \"scripts\": {\r\n    \"start\": \"npm run serve | npm run dev\",\r\n    \"serve\": \"./node_modules/.bin/http-server -p 8080\",\r\n    \"dev\": \"webpack-dev-server -d --progress --colors --port 8090 --history-api-fallback\"\r\n  },\r\n  \"author\": \"\",\r\n  \"license\": \"MIT\",\r\n  \"dependencies\": {\r\n    \"events\": \"^1.1.0\",\r\n    \"jquery\": \"^2.2.3\",\r\n    \"path\": \"^0.12.7\",\r\n    \"react\": \"^15.0.2\",\r\n    \"react-dom\": \"^15.0.2\",\r\n    \"react-mixin\": \"^3.0.5\",\r\n    \"react-router\": \"^2.4.0\"\r\n  },\r\n  \"devDependencies\": {\r\n    \"babel\": \"^6.5.2\",\r\n    \"babel-core\": \"^6.8.0\",\r\n    \"babel-loader\": \"^6.2.4\",\r\n    \"babel-polyfill\": \"^6.8.0\",\r\n    \"babel-preset-es2015\": \"^6.6.0\",\r\n    \"babel-preset-react\": \"^6.5.0\",\r\n    \"babel-register\": \"^6.8.0\",\r\n    \"http-server\": \"^0.9.0\",\r\n    \"webpack\": \"^1.13.0\",\r\n    \"webpack-dev-server\": \"^1.14.1\",\r\n    \"webpack-merge\": \"^0.12.0\"\r\n  }\r\n}\r\n```"}}
{"actor":{"display_login":"AndrejGajdos"}}