Question

我在vue应用程序中使用vue-router。我的申请中有以下路线。

const routes = [
    {name: "home", path: "/", component: Home},
    {name: "user", path: "/user", component: User},
    {name: "edit-user", path: "/user/edit", component: EditUser}
];

const router = new VueRouter({
    routes: routes,
    mode: 'history'
});

如果使用下面给出的router-link进行访问，这两条路线都能正常工作。

<router-link to="/user">Go to user</router-link>
<router-link to="/user/edit">Edit user</router-link>

如果我通过页面刷新直接访问路线，则路线“/ user”可以正常工作。但是路径“/ user / edit”显示一个黑色页面，控制台中只显示以下错误（没有任何其他错误详细信息）。

Uncaught SyntaxError: Unexpected token <

任何人都可以帮我解决这个问题吗？

Answer 1

这是由于一个非常小的原因引起的。在我的主HTML页面中，js文件链接如下：

<script type="text/javascript" src="js/app.js"></script>

通过将src值从"js/app.js"更改为"/js/app.js"，修复了此问题，如下所示：

<script type="text/javascript" src="/js/app.js"></script>

Answer 2

我也遇到了我通过添加

解决的相同问题

publicPath: '/'

在https://github.com/webpack/webpack-dev-middleware/issues/205#issuecomment-315847782上建议在我的Webpack配置文件中

感谢 Mark M. Muskardin

直接访问时，二级vue路由会引发错误

2 个答案: