解决方案：

Question

我试图在我的TypeScript React项目中使用wasm-clingo。我尝试为项目编写自己的d.ts文件：

// wasm-clingo.d.ts
declare module 'wasm-clingo' {
  export const Module: any;
}

并像这样导入：

import { Module } from 'wasm-clingo';

但是当我console.log(Module)时，它会显示undefined。我做错了什么？

注意：

clingo.js是主要的js文件。
index.html和index_amd.html是两个示例页面

解决方案：

我解决了这个问题：

// wasm-clingo.d.ts
declare module 'wasm-clingo' {
  const Clingo: (Module: any) => Promise<any>;
  namespace Clingo {}
  export = Clingo;
}

和

import * as Clingo from 'wasm-clingo';

Here's the source for this solution

Answer 1

我知道您找到了可接受的解决方案；但是，您这里实际上没有任何类型，只是将Module声明为any，这根本没有给您打字稿带来的好处。在类似的情况下，我使用了@types/emscripten，它为使用emscripten编译的Web程序集模块提供了完整的类型定义。您只需要这样做：

npm install --save-dev @types/emscripten

然后更改您的tsconfig.json types数组以为emscripten添加一个条目。之后，您可以只写Module.ccall(...)等。如果您愿意，当然可以写const Clingo = Module，然后如果您想使用比Module更具描述性的名称，可以对其进行调用（这很糟糕。名称！）。

不客气;）

Answer 2

我认为问题在于wasm-clingo导出模块本身，但import { Module } from 'wasm-clingo'需要一个属性。

尝试

import Clingo_ from 'wasm-clingo';
const Clingo: typeof Clingo_ = (Clingo_ as any).default || Clingo_;

将JS Web程序集导入TypeScript

解决方案：

2 个答案: