挂载钩子中的错误：“TypeError：没有'new'就不能调用类构造函数节点”

Posted 2023-02-22

【中文标题】挂载钩子中的错误：“TypeError：没有\'new\'就不能调用类构造函数节点”

【英文标题】：Error in mounted hook: "TypeError: Class constructor Node cannot be invoked without 'new'"挂载钩子中的错误：“TypeError：没有'new'就不能调用类构造函数节点”

【发布时间】：2021-03-24 19:12:30

【问题描述】：

错误

[Vue 警告]：挂载钩子中的错误：“TypeError：没有'new' 就无法调用类构造函数节点”

app.vue

<template>
  <v-container>
    <tiptap-vuetify
      v-model="content"
      :extensions="extensions" />

  </v-container>
</template>
 
<script>

// import the component and the necessary extensions
import  TiptapVuetify, Heading, Bold, Italic, Strike, Underline, Code, Paragraph, BulletList, OrderedList, ListItem, Link, Blockquote, HardBreak, HorizontalRule, History ,TodoList,TodoItem from 'tiptap-vuetify'
 
export default 
  // specify TiptapVuetify component in "components"
  components:  TiptapVuetify ,

  data: () => (
    content: `
      <h3>TIPTAP</h3>`,
    // declare extensions you want to use
    extensions: [
      History,
      Blockquote,
      Link,
      Underline,
      Strike,
      Italic,
      ListItem,
      BulletList,
      OrderedList,
      [Heading, 
        options: 
          levels: [1, 2, 3]
        
      ],
      Bold,
      Code,
      HorizontalRule,
      Paragraph,
      HardBreak,
      TodoList,
      [TodoItem, 
        options: nested: true
      ],],  
  ),
</script>

系统信息

操作系统：Windows10 Node.js 版本：v14.15.1

依赖关系

"core-js": "^3.6.5", “tiptap-vuetify”：“^2.24.0”， “vue”：“^2.6.11”， “vuetify”：“^2.2.11”

回购

todo-List issue

【参考方案1】：

我认为您可以执行以下操作来强制tiptap 进行转译。

# vue.config.js

transpileDependencies: [
    /[\\/]node_modules[\\/]tiptap.*/
],

我们得到这个错误的原因是因为我们试图用一个转译的类来扩展一个原生类。

参考资料：

TypeError TipTap