如何使用UI扩展Cytoscape.js在打字稿？(How to use UI extension

难道是打字稿可能使用Cytoscape的UI扩展？ 布局扩展名可以使用，但是当我需要例如https://github.com/cytoscape/cytoscape.js-cxtmenu ，我不能调用函数cy.cxtmenu（默认值），因为它在Cytoscape的界面心不是。 有没有办法使用它的方法吗？

我在index.ts代码：

import cytoscape = require('cytoscape');
import contextMenus = require('cytoscape-cxtmenu');
cytoscape.use(contextMenus);

const cy = cytoscape({
    container: document.getElementById('cy'),
    ...
});
let defaults = {
     menuRadius: 100, 
     selector: 'node',
    //...
};

let menu = cy.cxtmenu( defaults );

要index.d.ts我添加此声明：

declare module 'cytoscape-cxtmenu' {
    const ext: cytoscape.Ext;
    export = ext;
}

在transpilation在控制台我得到这样的：

ERROR in [at-loader] ./src/index.ts:152:17
    TS2339: Property 'cxtmenu' does not exist on type 'Core'.

Answer 1:

打字稿是JavaScript的一个超集 - 这将工作，如JavaScript将与打字稿工作的任何代码。

您所遇到的问题是缺乏对正在使用的Javascript库正确的打字稿定义。

至于我可以看到这是你的包上DefinitelyTyped无分型（ https://github.com/DefinitelyTyped/DefinitelyTyped ） -一个选择是写一些和提交pull请求。 然后，你可以安装它们的NPM包@types/cytoscape-cxtmenu请求被合并，发布后（并把它们作为项目中的文件，直到这样的时间）

另外，您可以导入库作为任意，例如：

const cxtmenu = require('cytoscape-cxtmenu');

这将意味着打字稿不会执行任何类型上与该库的交互检查。

根据您的打字稿项目是如何配置的，你可能需要或者做这样的事情：

// @ts-ignore
import * as cxtmenu from "cytoscape-cxtmenu";

Answer 2:

是的，你可以使用。 正如迈克尔说打字稿是JS的超集。 你可以做任何事情，JS可以做。

我使用一些其他的上下文菜单扩展具有角8.进口它像import * as contextMenus from 'cytoscape-context-menus';

如果库依赖于其他一些JS和CSS文件，必须将它们添加到angular.json文件

文章来源: How to use UI extension for Cytoscape.js in Typescript?