如何 use/import JavaScript 中的 TypeScript 声明文件？

Question

我正在尝试使用 Kotlin Multiplatform。

现在，我尝试开发一个 Kotlin JS 库以在外部 JavaScript 项目中导入和使用它。到目前为止效果很好。 Kotlin 从 Kotlin 代码创建 JavaScript 文件，我可以在 JavaScript 项目中导入和使用它们，它会做它应该做的事情。

但是我的IDE显示有一个未解析的函数或方法：

我是 JavaScript 的新手，想知道这个警告，因为它有效。

所以我搜索并找到了这个：

The Kotlin/JS IR compiler is capable of generating TypeScript definitions from your Kotlin code. These definitions can be used by JavaScript tools and IDEs when working on hybrid apps to provide autocompletion, support static analyzers, and make it easier to include Kotlin code in JavaScript and TypeScript projects. https://kotlinlang.org/docs/reference/js-ir-compiler.html#preview-generation-of-typescript-declaration-files-dts

我假设我需要这些 TypeScript 定义来告诉我的 IDE 这个方法存在。

几个小时后，我知道了如何告诉 Kotlin 编译器（？）生成这个定义，但警告仍然存在 :-(

生成的 shared.d.ts 文件如下所示：

type Nullable<T> = T | null | undefined
export namespace api.model {
    class AuthResponse {
        // lots of code
    }
}
export namespace api {
    function requestToken(): kotlin.js.Promise<api.model.AuthResponse>;
}
export as namespace shared;

这是生成的 package.json 文件：

{
  "main": "kotlin/shared.js",
  "devDependencies": {
    "webpack": "4.44.1",
    "webpack-cli": "3.3.12",
    "source-map-loader": "1.0.1",
    "dukat": "0.5.8-rc.3"
  },
  "dependencies": {
    // kotlin related imports
  },
  "peerDependencies": {},
  "optionalDependencies": {},
  "bundledDependencies": [],
  "name": "shared",
  "version": "1.0.0"
}

在 JavaScript 项目中，我将这一行添加到 package.json 文件 "shared": "file:..<path to the other package.json file>"。

我也发现了这个问题，但也许我无法理解答案，或者它没有解决我的问题。

有没有办法告诉 IDE 这个方法存在？这个 TypeScript 声明文件应该解决它吗？如果是，我该如何 use/import 呢？

Answer 1

简单来说，typescript声明文件就是用来让typescript能够理解JS的。不是相反。 .d.ts 文件仅在 TypeScript 项目中有用，它允许 TypeScript 在 JavaScript 模块上进行类型推断。

如果您想解决警告，请在您的 JS 项目中导入 shared.js 文件。

Answer 2

以下至少适用于 IntelliJ IDEA Ultimate：

将 "@types/shared": "file:../blh_shared/build/js/packages/shared" 添加到我的 React 项目的 package.json 文件中会在我的 IDE.

中添加代码完成

package.json 文件现在看起来像这样：

{
  "name": "react_app",
  "version": "0.0.1",
  "private": true,
  "dependencies": {
    "shared": "file:../blh_shared/build/js/packages/shared",
  },
  "devDependencies": {
    "@types/shared": "file:../blh_shared/build/js/packages/shared",
  }
}

如何 use/import JavaScript 中的 TypeScript 声明文件？

How to use/import TypeScript declaration files in JavaScript?

javascript

typescript

kotlin-js