我只是想用full webpack template设置我的vue项目,使用vue路由器并将不同的URL链接到不同的组件 .

src/router/index.html 如下:

import Vue from 'vue';
import Router from 'vue-router';
// eslint-disable-next-line
import Home from '../pages/home.vue';
// eslint-disable-next-line
import Config from '../pages/config.vue';

Vue.use(Router);

export default new Router({
  mode: 'hash',
  routes: [
    { path: '/', component: Home },
    { path: '/config', component: Config },
  ],
});

当我运行 npm run dev 并访问上述路由时,我有以下输出:

enter image description here

enter image description here

enter image description here

到目前为止,一切正常 . 问题是当我使用 history mode 时,我无法访问localhost:8080 / config:

enter image description here

并且控制台不显示任何错误:

enter image description here

我尝试的另一件事是使用simple-webpack模板将模式切换到历史记录 . 最糟糕的是它有效!所以,问题在于webpack-template,但我不知道如何使这项工作 .

我会感激任何帮助 .