嵌套路由打破了静态路径

Question

我的css放在static目录里面

html:

<html>
  <head>
    <link rel="stylesheet" href="static/font-awesome/css/font-awesome.min.css">
  </head>
  <body>
    <div id="app"></div>
  </body>
</html>

而且我有嵌套路线

const routes = [
    {
        path: '/user/:id', component: Profile,
        children: [
            {
                path: 'feeds',
                component: ProfileFeeds
            },
            {
                path: 'photos',
                component: ProfilePhotos
            },
        ]
    },
    ... some other routes... ,
];

当我在嵌套路由之外时，发现了静态文件。但是，当我导航到 user/user_21/feeds 时，Vue 找不到 css.

正在工作css:

http://localhost:8080/static/font-awesome/css/font-awesome.min.css

转成错误的静态路径：

http://localhost:8080/user/static/font-awesome/css/font-awesome.min.css

我该如何解决这个问题？

Answer 1

如果您 link 以 / 开头的 css 的绝对 url 怎么办？

 <link rel="stylesheet" href="/static/font-awesome/css/font-awesome.min.css">

嵌套路由打破了静态路径

Nested routes breaks the static path

vue.js

vue-router

vuejs2