Google Firebase上的Vuetify Nuxt 2通用（SSR）应用程序

Question

我的步骤：我已经创建了一个根项目文件夹，并且在该文件夹中运行了start-next-app src。 在根项目文件夹中，我运行firebase init将代码与Firebase项目链接。

// functions/index.js

const functions = require("firebase-functions");
//const { Nuxt } = require("nuxt-start");
const { Nuxt } = require('nuxt');

//(don't use development version of nuxt.config.js):
//const nuxtConfig = require("./nuxt.config.js");

// Use a very simplified version of the config to run the already
// build app on Firebase Functions 
const config = {
  //...nuxtConfig,
  dev: false, // Don't start in dev mode.
  // Enable debug when in the develop environment.
  debug: process.env.GCP_PROJECT === 'nuxt2-example-dev',
  buildDir: "nuxt",
  // Path to the assets.
  build: {
    publicPath: '/assets/',
  },
};

const nuxt = new Nuxt(config);

let isReady = false;

async function handleRequest(req, res) {
  if (!isReady) {
    try {
      isReady = await nuxt.ready();
    } catch (error) {
      process.exit(1);
    }
  }
  await nuxt.render(req, res);
}

exports.nuxtssr = functions.https.onRequest(handleRequest);

我已经构建了我的Nuxt应用程序，并且在开发模式下在本地运行良好。 nuxtssr 函数也可以正常工作（200 OK），但是我发现编译后的Vuetify出现许多错误，并且可能与以下问题有关：Nuxt-SSR-Vuetify Issue

。

我已经从gist添加了/plugins/breackpoint.js文件，但对我没有帮助：

import Vue from "vue"


//the properties of breakpoint that we want to mirror
const defaults = {
  xs: true,
  xsOnly: true,
  sm: false,
  smOnly: true,
  smAndDown: true,
  smAndUp: false,
  md: false,
  mdOnly: false,
  mdAndDown: true,
  mdAndUp: false,
  lg: false,
  lgOnly: false,
  lgAndDown: true,
  lgAndUp: false,
  xl: false,
  xlOnly: false
}

//create a property on the prototype of all instances that holds the breakpoint state
Vue.prototype.$breakpoint = new Vue({
  data: () => ({ ...defaults })
})

export default async function({ app }) {
  //init mixins and the watchers if they don't exist yet
  app.mixins = app.mixins || []
  app.watch = app.watch || {}

  //create a watcher for each breakpoint
  for (const prop in defaults) {
    //the watcher sets the breakpoint prop to cause an update
    app.watch[`$vuetify.breakpoint.${prop}`] = function(value) {
      //update our mirrored value properly
      this.$breakpoint[prop] = value
    }
  }

  //add a mixin that does the client prop setting
  app.mixins.push({
    //here is the magic, if we set the state with the correct value on client init it works
    mounted() {
      //for all props that we are processing
      for (const prop in defaults) {
        //set the initial value from vuetify
        this.$breakpoint[prop] = this.$vuetify.breakpoint[prop]
      }
    }
  })
}