Question

我是vue的新手，我是下一个错误。我使用默认配置的下一个模板https://github.com/vuejs-templates/webpack构建了一个小项目。

我已经添加了vue-router，当我处于开发模式时它工作正常，但是当我构建生产模式并使用时，它会显示一个空白页。

如果删除配置的历史记录模式，它可以正常工作。有什么建议吗？

感谢。

Answer 1

@bbsimonbb，我测试了后备但它没有用。

问题在于配置Router，特别是属性库。默认为＆＃39; /＆＃39;但您应该使用Web应用程序的基础进行配置。您可以更详细地阅读更多详情here

例如：http://www.mywebsite.com/myapp/ =＆gt; base：＆＃39; / myapp /＆＃39;

我配置路由器的文件路径是/src/router/index.js

我希望能帮助别人避免时间。

Answer 2

生产模式是否涉及更改Web服务器或计算机？听起来生产环境可能没有fallback route configured on the server。

Answer 3

由于这是Google上出现的vue-router空白页面问题的第一个stackoverflow链接，我想我会分享我的经验。

在摆弄路线路径后，我变得一片空白。我的路由器代码如下所示：

const router = new Router({
  routes: [
    {
      path: "/",
      redirect: "login"
    },
    {
      path: "login",
      component: Login
    },    
  ]
});

经过更多摆弄后，我在路由路径前加了一个正斜杠，然后再次看到我的登录页面，如下所示：

const router = new Router({
  routes: [
    {
      path: "/",
      redirect: "login"
    },
    {
      path: "/login",
      component: Login
    },    
  ]
});

带有历史模式和生产的vue-router的空白页面

3 个答案: