【问题标题】:Import ES6 module from http url in Typescript从 Typescript 中的 http url 导入 ES6 模块
【发布时间】:2020-06-01 01:47:30
【问题描述】:

我正在编写一个 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

当我尝试在 Typescript 中翻译我的模块时,我收到了这个错误:

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

我正在使用 ts-watch npm 模块编译 Typescript,除非我不使用来自 https://...import,否则它工作正常。

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

【问题讨论】:

  • 这能回答你的问题吗? Import TypeScript Module from a Uri
  • 跟我的情况差不多。但是我想在我的代码中使用 ES6 导入,这目前会导致 Typescript 编译错误。有没有办法消除这个错误?
  • 如果你只是想静音打字稿错误,你可以试试这个:typescriptlang.org/play?#code/…
  • 这就是我想做的!谢谢!

标签: javascript typescript


【解决方案1】:

感谢@acrazing 的评论,我设法解决了这个问题。方法如下:

在一个新的 ts 文件中:

declare module 'https://*'

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

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

declare module 'https://cdnjs.cloudflare.com/ajax/libs/redom/3.26.0/redom.es.js' {
    export * from 'redom'
}

并在 package.json 中添加 redom 依赖

  "dependencies": {
    "redom": "3.26.0",
    ...
  },

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

【讨论】:

  • 这对我没有任何作用,直到我将它与我的其余文件一起放在 src 文件夹中,而不是放在单独的顶级 types 文件夹中。老实说,还不确定为什么这很重要,可能是一些深奥的 tsc 解决方案。所以,对我来说,<PROJECT>/src/types/redom.d.ts 而不是 <PROJECT>/types/redom.d.ts
  • Whups,看起来我的问题实际上是忘记设置 TS 编译器选项"moduleResolution": "node"
猜你喜欢
  • 2016-04-09
  • 2015-08-13
  • 2015-12-24
  • 2018-03-08
  • 1970-01-01
  • 2017-01-04
  • 2019-07-06
  • 1970-01-01
  • 2017-05-21
相关资源
最近更新 更多