找不到模块“vue-tabulator”的声明文件

Question

我正在尝试在一个恰好用 TypeScript 编码的简单 Vue 应用程序中使用 vue-tabulator Vue 组件：https://github.com/angeliski/vue-tabulator。

main.ts:

import Vue from 'vue'
import VueTabulator from 'vue-tabulator'
import App from './App.vue'

Vue.config.productionTip = false

Vue.use(VueTabulator)

new Vue({
  render: h => h(App)
}).$mount('#app')

App.ts:

import { Component, Vue } from 'vue-property-decorator'

@Component
export default class App extends Vue {}

App.vue:

<template>
  <div id="app">
    <h1>Kewl</h1>
  </div>
</template>

<style scoped>
</style>

<script lang="ts" src="./App.ts">
</script>

使用npm run serve 运行我的应用程序时，我有以下信息：

 ERROR  Failed to compile with 1 errors                                                                                                                     2:23:19 PM
This dependency was not found:

* tabulator-tables in ./node_modules/vue-tabulator/dist/vue-tabulator.common.js

To install it, you can run: npm install --save tabulator-tables
Type checking in progress...
ERROR in C:/Users/eperret/Desktop/tabulator-tests/src/main.ts(2,26):
2:26 Could not find a declaration file for module 'vue-tabulator'. 'C:/Users/eperret/Desktop/tabulator-tests/node_modules/vue-tabulator/dist/vue-tabulator.umd.js' implicitly has an 'any' type.
  Try `npm install @types/vue-tabulator` if it exists or add a new declaration (.d.ts) file containing `declare module 'vue-tabulator';`
    1 | import Vue from 'vue'
  > 2 | import VueTabulator from 'vue-tabulator'
      |                          ^
    3 | import App from './App.vue'
    4 | 
    5 | Vue.config.productionTip = false
Version: typescript 3.5.3
Time: 3055ms

最后但同样重要的是，packages.json:

{
  "name": "tabulator-tests",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.3.2",
    "vue": "^2.6.10",
    "vue-class-component": "^7.0.2",
    "vue-property-decorator": "^8.3.0",
    "vue-tabulator": "^1.2.2"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^4.0.0",
    "@vue/cli-plugin-eslint": "^4.0.0",
    "@vue/cli-plugin-typescript": "^4.0.0",
    "@vue/cli-service": "^4.0.0",
    "@vue/eslint-config-standard": "^4.0.0",
    "@vue/eslint-config-typescript": "^4.0.0",
    "eslint": "^5.16.0",
    "eslint-plugin-vue": "^5.0.0",
    "typescript": "~3.5.3",
    "vue-template-compiler": "^2.6.10"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "@vue/standard",
      "@vue/typescript"
    ],
    "rules": {},
    "parserOptions": {
      "parser": "@typescript-eslint/parser"
    }
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {}
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions"
  ]
}

我检查这里给出的答案：Could not find a declaration file for module

但我看不到该线程中给出的解决方案实际上对我有什么帮助。

我该怎么办？

[编辑 1]

我尝试为vue-tabulator 安装 TypeScript 类型，但似乎没有这样的包：

npm install @types/vue-tabulator
npm ERR! code E404
npm ERR! 404 Not Found - GET https://registry.npmjs.org/@types%2fvue-tabulator - Not found
npm ERR! 404
npm ERR! 404  '@types/vue-tabulator@latest' is not in the npm registry.
npm ERR! 404 You should bug the author to publish it (or use the name yourself!)
npm ERR! 404
npm ERR! 404 Note that you can also install from a
npm ERR! 404 tarball, folder, http url, or git url.

[编辑 2]

关于垫片，我的src 文件夹中有两个相关文件：

shims-tsx.d.ts:

import Vue, { VNode } from 'vue'

declare global {
  namespace JSX {
    // tslint:disable no-empty-interface
    interface Element extends VNode {}
    // tslint:disable no-empty-interface
    interface ElementClass extends Vue {}
    interface IntrinsicElements {
      [elem: string]: any
    }
  }
}

shims-vue.d.ts:

declare module '*.vue' {
  import Vue from 'vue'
  export default Vue
}

Answer 1

首先尝试为'vue-tabulator'包安装@types，如果它不存在则 您可以为“vue-tabulator”添加一个 shim 文件以进行类型声明

这是因为您在项目中使用 TS，但“vue-tabulator”包不支持 TS。它只有那个包的 JS 版本

如何添加垫片

1. 在项目的 src 文件夹中应该有一个名为“shims”的文件夹
2. 创建一个名称和扩展名如“shims-tabulator.d.ts”的新文件
3. 将以下代码复制并粘贴到该文件中'declare module'vue-tabulator';' (声明模块'vue-tabulator';)
4. 重新启动您的项目