TSLint No Reference Rule Alternative

Question

I'm currently using Angular 9 and Google API to log application users in with the Google credentials. The gapi and gapi.auth2 definitions are in place under "@types" in "node_modules", and I added them under "types" in "tsconfig.js" I've written a service that imports the Google API JS library at run-time, and I've also added the following to make it work in Angular:

/// <reference path="../../../node_modules/@types/gapi/index.d.ts" />
/// <reference path="../../../node_modules/@types/gapi.auth2/index.d.ts" />

They are properly pathed and working fine. However, when using WebStorm as my IDE instead of Visual Studio Code, I get a TSLint warning that this is not permitted as is documented here: https://palantir.github.io/tslint/rules/no-reference/ .

Using import as I would normally doesn't seem to work either.

Since everything works just fine, I suppose I could just ignore it. But to be honest, it is an unusual way to do things and I'm wondering if anyone here can show me a proper method for including these definitions so that I car refer to them without error from Angular.

Thanks!

Answer 1

In further research, and in updating to the latest version of ng-gapi, I discovered that there are modules and services already available that do what my custom service was doing. It's possible the solutions I found online that suggested using references in this manner were already obsolete, or I simply did not see that ng-gapi was more than just a way to avoid errors when referencing Google API objects and methods.

If you run into this issue and are wondering the same thing, I advise to not worry about it and just use the available services and modules in ng-gapi rather than re-invent the wheel.