在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML5  HTML/ react-router4 頁面刷404

react-router4 頁面刷404

這是路由

import React from 'react'
import { Router, Route, Link, Switch, Redirect} from 'react-router-dom';
import history from '../history/history'

import Login from '../views/login'
import Home from '../views/home'

const Routes = (
  <Router history={history}>
    <Switch>
      <Route path="/" exact component={Login}></Route>
      <Route path="/home" component={Home}></Route>
      <Redirect to="/"></Redirect>
    </Switch>
  </Router>
)

export default Routes

登錄頁跳轉(zhuǎn)到home頁的時候刷新頁面404，用的BrowserHistory，下面是node的入口文件app.js

const express = require('express');
const bodyParser = require('body-parser');
const path = require('path');
const router = require('./routes/router');

const app = express();

app.use(bodyParser.urlencoded({extended: true}));
app.use(bodyParser.json());
app.use(router);

app.use(express.static(__dirname + '/public'))

app.get('*', function (request, response){
  response.sendFile(path.resolve(__dirname, 'public', 'index.html'))
})

app.listen(3000, () => {
    console.log('devServer start on port:3000...');
});

這是home頁面刷新后無資源

這是webpack的index.js
圖片描述

這是devServer
圖片描述

搜了一些答案，沒有解決

回答
編輯回答
刮刮樂

devserver里加上

historyApiFallback: {
      // Paths with dots should still use the history fallback.
      // See https://github.com/facebookincubator/create-react-app/issues/387.
      disableDotRule: true,
    },
2018年7月6日 09:10
編輯回答
尐飯團(tuán)

webpack.dev.conf.js

devServer: {
    clientLogLevel: 'warning',
    historyApiFallback: true,
    hot: true,
    contentBase: false, // since we use CopyWebpackPlugin.
    compress: true,
    host: HOST || config.dev.host,
    port: PORT || config.dev.port,
    open: config.dev.autoOpenBrowser,
    overlay: config.dev.errorOverlay
      ? { warnings: false, errors: true }
      : false,
    publicPath: config.dev.assetsPublicPath,
    proxy: config.dev.proxyTable,
    quiet: true, // necessary for FriendlyErrorsPlugin
    watchOptions: {
      poll: config.dev.poll,
    }
  }

node入口app.js

app.use(express.static(__dirname + '/public'))

app.get('/*', function (request, response){
  response.sendFile(path.resolve(__dirname, 'public', 'index.html'))
})

解決了

2018年3月31日 20:19