因此，我将vuetify与“基线”布局一起使用（来自文档：https://vuetifyjs.com/en/examples/layouts/baseline).我将一页设置为预呈现，其中包括：
configureWebpack: {
plugins: [
new PrerenderSPAPlugin({
// Required - The path to the webpack-outputted app to prerender.
staticDir: path.join(__dirname, 'dist'),
// Required - Routes to render.
routes: [ '/about' ],
})
]
}
生成的页面很好。我与SPA的html内容进行了比较，结果是一样的。但是，当web服务器使用它时，菜单不起作用。这就像没有执行js来将事件附加到元素。
关键是，即使我把spa页面的内容复制到一个页面上，它也不起作用。我真的不明白。我的调试控制台中没有错误：-(
如果有人受到启发？或者一个更深入地分析问题的过程。
谢谢
index.html包含具有id="app"的根元素：
<body>
<div id="app"></div>
</body>
main。js将vuetify应用程序装载到根元素中：
new Vue({
router,
render: h => h(App)
}).$mount('#app');
App。vue-您需要使用与索引中相同的：id=“app”将应用程序包装到元素中。html
<template>
<div id="app" data-server-rendered="true">
<v-app>
...
</v-app>
</div>
</template>
当您通过调用将Vue应用装入根元素时$mount（“#app”）实际上是用应用程序替换根元素。
因此，在预呈现索引之前。html看起来像：
<body>
<div id="app"></div>
</body>
在预渲染之后，如：
<body>
<div data-app="true" class="application theme--light">
...
</div>
</body>
然后，当JS加载时，它不能挂载Vue应用，因为不再有#app元素，所以您会看到页面看起来不错，但没有正常工作，因为JS实际上没有挂载。
因此，如果我们将应用程序包装在一个元素中，该元素与索引中的根元素具有相同的我们可以多次重新装载Vue应用程序，因为根元素id。html
这就是我浪费了4个小时的生活。。。
当我找到Groxan的答案时，我几乎要切换到完整的SSR。顺便说一句，将id=“app”设置为
