从 Typescript 中的 http url 导入 ES6 模块

poc*_*all 11 javascript typescript

我正在编写一个 ES6 模块,它依赖于使用 http url 指定的其他 ES6 模块,如下所示:

import { el, mount } from "https://cdnjs.cloudflare.com/ajax/libs/redom/3.26.0/redom.es.js";
const pElem = el("p") // definitely works in Javascript
Run Code Online (Sandbox Code Playgroud)

当我尝试在 Typescript 中翻译我的模块时,出现以下错误:

找不到模块“https://cdnjs.cloudflare.com/ajax/libs/redom/3.26.0/redom.es.js”或其相应的类型声明。

我正在使用ts-watchnpm 模块来编译 Typescript,除非我不使用importfrom ,否则它工作正常https://...

我还知道,如果我尝试导入 npm 模块(例如import {el} from "redom"),它也可以工作。但我正在写的是一个用于 Web 浏览器的模块,而不是 npm 的模块。因此,使用webpack不是一个选择。

poc*_*all 17

感谢@acrazing 的评论,我设法解决了这个问题。就是这样:

在新的 ts 文件中:

declare module 'https://*'
Run Code Online (Sandbox Code Playgroud)

这可以消除 Typescript 编译器尝试读取类型声明的错误。

如果您想将类型声明作为节点依赖项进行访问,请将其粘贴到新的 ts 文件中:

declare module 'https://cdnjs.cloudflare.com/ajax/libs/redom/3.26.0/redom.es.js' {
    export * from 'redom'
}
Run Code Online (Sandbox Code Playgroud)

redom在 package.json 中添加依赖项

  "dependencies": {
    "redom": "3.26.0",
    ...
  },
Run Code Online (Sandbox Code Playgroud)

然后,从本地目录读取类型声明./node_modules,VSCode 也识别类型。