vuetify-form-base 表单未在生产模式下加载

Question

我在 Nuxt-Vue 项目中使用 vuetify-form-base 并且在开发模式下 evrythings 是可以的(npm 运行 dev) 当我切换到生产模式时（npm 运行 start）；表单未加载且未发生错误或警告。

我的 nuxt.config.js 文件是：

import colors from 'vuetify/es5/util/colors'

export default {
  ssr: false,
  head: {
    titleTemplate: '%s - nuxt-form-sample',
    title: 'nuxt-form-sample',
    htmlAttrs: {
      lang: 'en'
    },
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: '' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },
  components: true,
  buildModules: [
    '@nuxtjs/vuetify',
  ],
  vuetify: {
    customVariables: ['~/assets/variables.scss'],
    theme: {
      dark: true,
      themes: {
        dark: {
          primary: colors.blue.darken2,
          accent: colors.grey.darken3,
          secondary: colors.amber.darken3,
          info: colors.teal.lighten1,
          warning: colors.amber.base,
          error: colors.deepOrange.accent4,
          success: colors.green.accent3
        }
      }
    }
  }
}

vuetify-form-base 的用法是：

<div>
  <v-form-base :schema="schema" :model="model"/>
</div>

Answer 1

我解决了这个问题 https://github.com/wotamann/vuetify-form-base/issues/50 在 SSR 模式下表单没有正确呈现！

解决方案1：

你应该使用'v-mask'包并导入vuetify-form-base包中的主要组件文件。

您应该将此包导出到插件中，如下所示： Vue.component('VueMask', () => 导入('v-mask'))

之后将主文件组件添加到您的项目中：

https://github.com/wotamann/vuetify-form-base/blob/master/dist/src/vFormBase.vue

备选方案：

您可以使用 https://www.npmjs.com/package/vuetify-form-base-ssr 包。

Answer 2

我的答案不清楚，所以我想告诉你一步一步解决这个问题的简单方法。我花了很多时间解决了这个问题，这里是解决方案： 1- 安装 v-mask 包 2- 只需将 https://github.com/wotamann/vuetify-form-base/blob/master/dist/src/vFormBase.vue 复制到您的组件文件夹 3- 在你的插件中使用 Vue.component('VueMask', () => import('v-mask')) 4- 然后删除 form-base 导入页面。

vuetify-form-base 表单未在生产模式下加载

vuetify-form-base Form not Load in Production Mode

dynamic-forms

vue.js

nuxt.js

vuetify.js

vuetify-form-b​​ase 表单未在生产模式下加载

vuetify-form-base Form not Load in Production Mode

dynamic-forms

vue.js

nuxt.js

vuetify.js

vuetify-form-base 表单未在生产模式下加载