I wanted to use Jos de Jong’s outstanding JSON editor module for a project and had no access to any Angular wrapper module. I also didn’t have the time to write a module for it by myself.
So how do we use CommonJS Node modules (or other non-Angular modules) with Angular 2+?
Make sure the package actually exists in the project. Let’s assume it is under
The first thing to do is to head over the
angular-cli.jsonfor Angular 5 and under) and add the script. For example with the
I just printed the relevant hierarchy here. So pay attention not to insert the script to the
testconfiguration like I stupidly did. And keep in mind that the path is relevant to the project’s
Try using the class in your Angular module. Because the script was added in
angular.json, the code should work, but the compiler will complain that the class is unknown. And for good reason, since there is no way to import it yet.
Now create typings.d.ts if it does not exist. And add a declaration for your class, for example with
jsoneditor‘s class called
declare var ClassName: any;
Much like a C/C++ header, this is a way of telling the compiler “Don’t worry, I’ll provide an implementation of that class at runtime”.
Now you should be able to import the class in your module, service or other without problem.