向 IDE 提供使用電子的 remote.require 導入的模塊的 typescript 定義

Question

我想知道在使用電子remote模塊用於 IPC 時，是否可以從渲染器源目錄中的 electron 主源目錄中獲取模塊的 typescript 類型。

我的主要目標是能夠讓我的 IDE 在我使用渲染器源目錄文件時為我提供有關模塊導出類型的自動完成提示。 如果重要的話，我會同時使用 IntelliJ 和 vscode。

例如，假設一個電子反應應用程序的文件夾結構如下：

/src
|-- index.tsx       // Entry point for building the renderer app
/lib
|-- electron.ts     // main entry point to initialize electron app
|-- api/            // The module that implements the API contract to the front end
    |-- index.ts

假設 api/index.ts 導出了一個我想從 React 應用程序中使用的常量。

export const foo = 1;

從渲染器（React）源文件中，我可以按如下方式訪問foo ：

const api = window.require("electron").remote.require("./api")
console.log(api.foo);

但是，大概是因為require("./api") IDE 無法幫助我弄清楚該模塊有什么可用的。 它也不能確定foo是一個數字。

我如何幫助 typescript 編譯器/IDE 找出 api 的類型？

是否有可能幫助 typescript 編譯器找出...remote.require("./api")實際上是/lib/api中的 api 模塊？

在這種情況下，我將成功定義為編譯器告訴我api.bar未定義並告訴我api.foo 。

Answer 1

嘗試使用導入類型明確告訴 TypeScript api 的類型api

const api: typeof import('./api') = window.require("electron").remote.require("./api");
api.  // IntelliSense should show a suggestion for `foo` here

我相信您必須為以這種方式進行的每個導入添加顯式類型。