Nuxt 抛出错误：未捕获的 TypeError：无法将类作为函数调用答案

【问题标题】：Nuxt throwing error : Uncaught TypeError: Cannot call a class as a functionNuxt 抛出错误：未捕获的 TypeError：无法将类作为函数调用
【发布时间】：2021-12-23 03:48:56
【问题描述】：

我在Vuejs/Nuxtjs 应用程序中使用drawflow npm library，但是当我启动应用程序时，我的控制台中出现以下错误：

classCallCheck.js:3 Uncaught TypeError: Cannot call a class as a function
    at _classCallCheck (classCallCheck.js:3)

以下是我按照文档执行的步骤：

使用npm i drawflow --save 安装drawflow
在plugins文件夹下创建drawflow.js文件并添加代码：

import Vue from 'vue'
import Drwaflow from 'drawflow'
Vue.use(Drwaflow)

修改nuxt-config.js文件并添加plugin并构建：

plugins: [
    { src: "~/plugins/drawflow", mode:"client" }
  ],

  build: {
    transpile: ["drawflow"]
  },

我的Vue Component 在Mounted 功能中有以下功能：

  async mounted () {
    const vm = this

    if (process.browser) {
      const Drawflow = await require('drawflow')
      // const styleDrawflow = await require('drawflow/dist/drawflow.min.css')
      Vue.use(Drawflow)

      const id = document.getElementById('drawflow')
      console.log(id)
      vm.editor = new Drawflow(id, Vue, vm)
      vm.editor.start()
    }
  }

不明白这里出了什么问题。找不到Nuxt 的任何相关帖子。有人可以解释一下这段代码有什么问题吗？

【问题讨论】：

如果全局需要，可以在插件中加载它，或者使用 import 语法在本地加载它（就像你上次那样）。
@kissu 非常感谢您的回复。我什至尝试过local import，但我得到了一个不同的错误：stackoverflow.com/q/69915969/7584240
@kissu 我删除了plugin/drawflow.js 和nuxt-config.js，所以我可以在本地导入它，但即便如此我也遇到了问题。

标签： javascript vue.js vuejs2 nuxt.js draw

【解决方案1】：

即使这个问题可以做更多的工作，最后，OP 希望让它在本地工作。
此用例的解决方案是 available here，并使用我的 PoV。

因此，我不建议采用插件路径来防止它在全球的整个 SPA 中可用。

【讨论】：