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

Posted 2023-03-13

【中文标题】找不到模块“vue-tabulator”的声明文件

【英文标题】：Could not find a declaration file for module 'vue-tabulator'

【发布时间】：2020-03-04 02:21:09

【问题描述】：

我正在尝试在一个恰好用 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

【参考方案1】：

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

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

如何添加垫片

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

【讨论】：

我用 EDIT 更新了我的帖子。长话短说，安装 ts 类型不起作用（基本上不存在）。

你可以尝试像上面的例子那样为'vue-tabulator'包添加垫片

我在src 中没有文件夹shims，而是shims-tsx.d.ts 和shims-vue.d.ts 两个文件。

是的。然后在同一位置创建一个新文件，稍后您可以将这些文件放入一个文件夹中以进行良好实践

当然让我试试这个！