Nuxt生产模式延迟加载资源

Question

我目前正在运行一个 nuxt 应用程序，它在开发模式下运行良好。然而，当我切换到生产模式时，您可以看到一些 css 被推迟到稍后加载。我很确定这是一些 vuetify css。我说一些是因为有些类确实已经存在。

您可以通过刷新此页面明白我的意思（确保禁用缓存）。

似乎我缺少某种 nuxt/webpack 配置来禁用它，但我不确定它是什么。

编辑：临时站点有时会关闭，所以这是 gif 形式发生的情况，您可以看到某些关键的 css 稍后加载。

编辑 #2：此处添加了最小重现https://github.com/amritk/vuetify-nuxt-repro

编辑#3：所以@Sabee 解决了我的最小重现，但这并没有解决我原来的问题。正如您在这里所看到的，有一些样式块添加在客户端上，但在服务器上不存在。如何确保这些样式加载到服务器上？

服务器：

客户：

[

Edit#3：特别是 v 布局样式加载较晚。有什么办法可以在服务器上预加载这个CSS吗？

Answer 1

好吧@Sabee 的回答让我找出了问题所在。事实证明，是 VLayout 组件中的样式未加载。我认为这是 vuetify-loader 插件问题，而不是 nuxt。它正在服务器上加载，而不是客户端上加载。我所要做的就是更改我的配置以在开始时加载 VLayout 并且它起作用了！

Vuetify 插件

import Vue from 'vue'
import Vuetify, { VLayout } from 'vuetify/lib'

Vue.use(Vuetify, {
    options: {
        .
        .
        .
    },
    theme: {
        .
        .
        .
    },
    components: {
        VLayout
    }
})