Vega-Embed 在 Vue Typescript 项目中引

Vega-Embed 在 Vue Typescript 项目中引入报错 Cannot find module 'vega-typings'

报错现场

template

<template>
  <div>
    <div id="vis"></div>
  </div>
</template>

script

<script langth="ts">
import { Component, Vue } from 'vue-property-decorator'
import embed from 'vega-embed'

@Component({})
export default class Vega extends Vue {
  private mounted() {
    console.info(embed)
  }
}
</script>

终端报错内容

ERROR in /home/xxx/node_modules/vega-tooltip/build/src/Handler.d.ts
1:32 Cannot find module 'vega-typings'.
  > 1 | import { TooltipHandler } from 'vega-typings';
      |                                ^
    2 | import { Options } from './defaults';
    3 | /**
    4 |  * The tooltip handler class.

package.json

...
  "devDependencies": {
    "typescript": "^3.4.3",
    "vega": "^5.13.0",
    "vega-embed": "^6.9.0",
    "vega-lite": "^4.13.1",
    ...
  },
...

分析解决

一开始以为Vega相关包版本在TypeScript中不支持，更新版本，调整引入方式的写法都不行，Baidu，Google, Github issues 中找了一波问题后也没发现有人遇到 Vega 的引入问题。

再次基于报错分析，发现是一个 module 没有安装导致，这个模块应该是 vega,vega-lite,vega-embed 安装的时候自动的安装的依赖， 在 npm package (https://www.npmjs.com/) 中搜索一下 vega-typings, 有对应的包，并且几天前还更新了，本地单独安装一下试试？

npm install vega-typings -D

本地再次 npm run serve 报错没有了