historyApiFallback 在 Webpack 开发服务器中不起作用 [英] historyApiFallback doesn't work in Webpack dev server
本文介绍了historyApiFallback 在 Webpack 开发服务器中不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我使用 Webpack 开发服务器和 browserHistoryReact Router 以通过 HTML5 History API 操作 url.historyapifallback-option 在我的 webpack 中不起作用配置文件.刷新 http://localhost:8080/users
或 http://localhost:8080/products
后,我得到 404.
webpack.config.js
var webpack = require('webpack');var merge = require('webpack-merge');const TARGET = process.env.npm_lifecycle_event;常见的变量 = {缓存:真实,调试:真的,条目:'./src/script/index.jsx',解决: {扩展名:['', '.js', '.jsx']},输出: {sourceMapFilename: '[文件].map'},模块: {装载机: [{测试:/.js[x]?$/,loader: 'babel-loader',排除:/(节点模块)/}]},插件: [新的 webpack.ProvidePlugin({$: "jquery",jQuery:jquery"})]};if(TARGET === 'dev' || !TARGET) {module.exports = 合并(普通,{开发工具:'评估源地图',开发服务器:{historyApiFallback: 真},输出: {文件名:'index.js',publicPath: 'http://localhost:8090/assets/'},插件: [新的 webpack.DefinePlugin({'process.env.NODE_ENV': JSON.stringify('dev')})]});}
index.html
<头><meta http-equiv="Content-type" content="text/html; charset=utf-8"/><title>测试</title>头部><身体><div id="内容"><!-- 这是根 react 组件将被渲染的地方 -->
<script src="http://localhost:8090/webpack-dev-server.js"></script><script type="text/javascript" src="http://localhost:8090/assets/index.js"></script>