Question

import Vue from 'https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.esm.js'

如果我要求TSC编译以上内容，则会抱怨（合理地如此）无法找到该模块的定义。但是，我不知道如何给TypeScript定义文件。 declare module 'https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.esm.js' { ... }不起作用，并且https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.esm.js不是有效的文件名，因此我无法创建名为该文件的文件。我尝试使用tsconfig.json paths，但也无法正常工作。

让TypeScript接受我的Vue类型定义有什么魔力？

注意：理想的解决方案也可以与//cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.esm.js和./vue.esm.js和./vue.js一起使用。后两个是相对路径，我不知道如何为其提供定义路径。

Answer 1

您要的是这个

stubs.d.ts

declare module 'https://cdn.jsdelivr.net/npm/vue@2.5.21/dist/vue.esm.js' {
  const Vue: typeof import ('vue');

  export default Vue;
}

但是，使用import语句从CDN加载模块并不是使用模块的惯用方式-而且没有捆绑器支持，至少在我所知的范围内。

如果要将Vue用作模块，则应将其安装在本地（npm install vue），然后从本地node_modules目录导入。

import Vue from 'vue';

如果您想将其用作UMD软件包（即，使浏览器从CDN而不是从捆绑软件下载），则需要安装类型并将其包含在项目中。

Vue将其声明文件（*.d.ts）捆绑在实际的可执行代码旁边，因此您不能仅安装类型。您仍然需要下载整个软件包。

npm install vue

将已安装的类型定义添加到您的项目中。在您的tsconfig.json中，确保"vue"中包含compilerOptions.types。

{
  "compilerOptions": {
    "types": ["vue"]
  }
}

这将在脚本中全局显示键入。

如何为TSC提供URI导入的打字稿定义？

1 个答案: