如何運行運行 - 歷史-API的回退的WebPack內

Question

let path = require('path') 
 
module.exports = { 
 
    entry:path.resolve('public/src/index.js'), 
 
    output: { 
 
     path:__dirname + "/public", 
 
     filename: "bundle.js" 
 
    }, 
 
    module: { 
 
     loaders: [{ 
 
      exclude: /(node_modules)/, 
 
      loader:'babel-loader', 
 
      query:{ 
 
       presets: ['es2015', 'react'] 
 
      } 
 
     }] 
 
    }, 
 
    watch:true 
 
};

我使用reactjs路由器和教程，他們多數告訴你寫

- 歷史的API -fallback爲路由器工作

let path = require('path') 
 
module.exports = { 
 
    entry:path.resolve('public/src/index.js'), 
 
    output: { 
 
     path:__dirname + "/public", 
 
     filename: "bundle.js" 
 
    }, 
 
    module: { 
 
     loaders: [{ 
 
      exclude: /(node_modules)/, 
 
      loader:'babel-loader', 
 
      query:{ 
 
       presets: ['es2015', 'react'] 
 
      } 
 
     }] 
 
    }, 
 
    watch:true 
 
};

{ 
 
    "name": "pr_v1", 
 
    "version": "1.0.0", 
 
    "description": "", 
 
    "main": "index.js", 
 
    "scripts": { 
 
    "start": "node server/index.js & webpack", 
 

 
    "test": "echo \"Error: no test specified\" && exit 1" 
 
    }, 
 
    "author": "", 
 
    "license": "ISC", 
 
    "dependencies": { 
 
    "axios": "^0.16.2", 
 
    "babel-cli": "^6.26.0", 
 
    "babel-core": "^6.26.0", 
 
    "babel-loader": "^7.1.2", 
 
    "babel-preset-es2015": "^6.24.1", 
 
    "babel-preset-react": "^6.24.1", 
 
    "body-parser": "^1.18.2", 
 
    "dotenv": "^4.0.0", 
 
    "express": "^4.15.4", 
 
    "moment": "^2.18.1", 
 
    "react": "^15.6.1", 
 
    "react-dom": "^15.6.1", 
 
    "react-redux": "^5.0.6", 
 
    "react-router": "^4.2.0", 
 
    "redux": "^3.7.2", 
 
    "redux-thunk": "^2.2.0", 
 
    "request": "^2.82.0", 
 
    "webpack": "^3.5.5" 
 
    } 
 
}

import React from 'react'; 
 
import ReactDOM from 'react-dom'; 
 
import {Provider} from 'react-redux'; 
 
import {createStore, applyMiddleware} from 'redux'; 
 
import thunk from 'redux-thunk'; 
 
import Reducer from './Reducer/'; 
 
import {Router, Route, browserHistory} from 'react-router'; 
 

 
import App from './Components/App.jsx'; 
 

 

 

 

 

 

 

 
const store = createStore(Reducer, applyMiddleware(thunk)); 
 

 

 
    
 

 
ReactDOM.render(
 

 
    <Router history={browserHistory}> 
 
     <Route path='/user' component={App}/> 
 
    </Router> 
 

 
    ,document.getElementById('root'));

我是新來的反應路由器，我試圖讓--history-api-fallback工作。教程說，把它放在json文件的構建中，但我沒有構建腳本。我在想，也許它應該在某處是webpack配置文件。我不確定。我的問題是我可以在哪裏插入--history-api-fallback以便它可以工作。

Answer 1

對於webpack dev服務器，您只需添加webpack dev配置。這將在你的開發環境中工作。

devServer: 
{ 
    historyApiFallback: true 
},