vue-router的history模式页面not found？

Question

首页可以显示，再往下的子页就not found了

dev-server.js

import Koa from 'koa'
import path from 'path'
import webpack from 'webpack'
import serve from 'koa-static'
import KoaWebpackDevMiddleware from 'koa-webpack-dev-middleware'
import KoaWebpackHotMiddleware from 'koa-webpack-hot-middleware'
import history from 'koa-connect-history-api-fallback'

import devConf from './webpack.dev.conf'
import config from './../config'

import opn from 'opn'

const webpackConfig = devConf
const autoOpenBrowser = !!config.dev.autoOpenBrowser

const koa = new Koa()
const compiler = webpack(webpackConfig)

koa.use(KoaWebpackDevMiddleware(compiler, {
    publicPath: config.dev.publicPath,
    quiet: true
}))
koa.use(KoaWebpackHotMiddleware(compiler))
koa.use(history({
    rewrites: [
        {
            from: /^\/.*$/,
            to: '/'
        }
    ]
}))
koa.use(serve(path.join(__dirname, '/dist/'), { extensions: ['html'] }))

let _resolve
const readyPromise = new Promise(resolve => {
    _resolve = resolve
})

if (autoOpenBrowser) {
    opn('http://localhost:8001')
}

const server = koa.listen(8001, () => {
    console.log('app listen at 8001')
})

export default {
    ready: readyPromise,
    close: () => {
        server.close()
    }
}

router.js

import Vue from 'vue'
import Router from 'vue-router'
import Landing from './landing'

let routerArr = [
    Landing
]

let routes = []

routerArr.map(route => {
    routes = routes.concat(route)
})

const None = () => import(
    /* webpackChunkName: 'None' */
    '../views/none.vue'
)

const Index = () => import(
    /* webpackChunkName: 'Index' */
    '../views/index.vue'
)

const Login = () => import(
    /* webpackChunkName: 'Index' */
    '../views/login.vue'
)

Vue.use(Router)

routes.push(
    {
        path: '*',
        name: '404',
        component: None
    },
    {
        path: '/',
        name: 'Index',
        component: Index
    },
    {
        path: '/login',
        name: 'Login',
        component: Login
    }
)

const router = new Router({
    mode: 'history',
    routes: routes
})
console.log(router, routes)
router.beforeEach((to, from, next) => {
    next()
})

router.afterEach(route => {

})

export default router

跑起来之后，浏览器直接输地址访问login页就报not found。我按照vue-router官网文档加了koa-connect-history-api-fallback也不行。现在只是本地开发环境，还没涉及后台，应该后台暂时不需要配置吧？求指导。。。

----------fixed---------
参考链接：https://www.jianshu.com/p/c68...
koa.use(history())要放在所有中间件之前，否则页面先刷新了，history就没用了。原来还是和koa的架构有关的。。

Answer 1

不知道，没出现这种问题，你的开发环境是自己搭建的吗？
我看老版本的vue-cli webpack模板里是这么配的
app.use(require('connect-history-api-fallback')())，不过这个app是express的。
新版本的模板里没找到哪里有配置，但是能正确跳转。

Answer 2

{
        path: '*',
        name: '404',
        component: None
    },
    

这个要放最后一个路由，不然第一个匹配到的就是他

Answer 3

你是如何输入的路径？ locahost:8080/login ?这样？