在 angular nx 项目中导入 JavaScript 模块

Question

I have an angular project built with nx I want to import standard JavaScript libraries which do not have typescript typings for example I want to install and use cytoscape and cytoscape-context-menus

I get compilation errors such as

error TS7016: Could not find a declaration file for module 'cytoscape-context-menus'. 'C:/dev/armo/armo-ng-app/node_modules/cytoscape-context-menus/cytoscape-context-menus.js' implicitly has an 'any' type. Try npm i --save-dev @types/cytoscape-context-menus if it exists or add a new declaration (.d.ts) file containing declare module 'cytoscape-context-menus';

How can I solve them? I tried to put declaration files but I think my setup doesn't see them.

Answer 1

since there's no available type definition npm package, you have to write your own. start with the ones you need and continue to build on top of it as needed.

if you like you can share it too as an npm package.

found this article for writing TypeScript type definition files by @dubtypescript: http://blog.wolksoftware.com/contributing-to-definitelytyped

also take a look at how cytoscope is typed from here, borrow their ways: https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/cytoscape/index.d.ts

Added a stackblitz to checkout:

https://stackblitz.com/edit/cytoscape-6cyuem?file=src%2Fapp%2Fcytoscape-context-menus.d.ts