Nuxt + SurveyJS：使用 nuxt generate 或 nuxt build 时 - 超出最大调用堆栈大小

问题描述

我的survey-vue (surveyJS) 在开发上运行良好，但是当我尝试部署时，在使用调查组件登陆页面时出现超出最大调用堆栈大小错误。 我想这就是我导入插件的方式，但我不确定。

plugins/survey-vue.js

import Vue from "vue";
import * as surveyVue from "survey-vue";

Vue.use(surveyVue);

nuxt.config.js

plugins: [
    ...
    {
      src: '~/plugins/survey-vue',mode: 'client'
    },]

components/Sur​​vey.vue

<template>
  <div id="surveyElement" class="w-full inline-block">
      <survey :survey="surveyRender" />
  </div>
</template>

<script>
import * as surveyVue from "survey-vue";
export default {
  props: {
    json: {
      type: Object
    },results: {
      type: Object
    }
  },data() {
    const jsonSurvey = this.json;
    const survey = new surveyVue.Model(jsonSurvey);

    // style the survey 
    var myCss = {...};
    
    survey.onComplete.add(survey => {
      this.result = survey.data;
      this.sendResults()
    })

    survey.css = myCss
    return {
      surveyRender: survey,result: []
    }
  },methods: {
    sendResults () {
      this.$emit('resultCaptured',this.result)
    }
  },created () {

  }
}
</script>

页面/.vue

<template>
  <div class="flex flex-col justify-center mx-auto w-full md:w-1/2 px-4">
    <div class="w-auto mx-auto p-4 mt-12" v-if="surveyCreated">
      <client-only>
        <survey :json="json" :results="reportedSymptoms"></survey>
      </client-only>
    </div>
  </div>
</template>
....

感谢这里的任何见解。已经尝试调试了好几天都无济于事。

解决方法

已修复：我调用了我的组件文件 Survey.vue，它与为插件的调查实例保留的名称相同。将我的组件文件更改为 SurveyComponent.vue 并解决了。感谢@kissu 让车轮转动