I try to use Knockout.js with TypeScript.

I have these relevant packages installed with npm locally (just one root npm project), as listed by npm ls:

• @types/[email protected]
• [email protected]
• [email protected]
• UNMET PEER DEPENDENCY typescript@>= 2.x (I do not know what this means but maybe it is relevant)
• @types/[email protected]
• @types/[email protected]

The wpapi types package works well with the actual wpapi package, but knockout does not seem to work this way.

Sometimes I get this error above in the browser console:

Error: Cannot find module 'knockout' from '/.../root-project-directory/subdir1/subdir2/js'.

Other times I get this as the output of tsc:

[17:52:36] Starting compilation in watch mode...

../node_modules/@types/knockout/index.d.ts:1062:13 - error TS2403: Subsequent variable declarations must have the same type.  Variable 'ko' must be of type 'typeof import("/.../root-project-directory/node_modules/knockout/build/types/knockout")', but here has type 'KnockoutStatic'.

1062 declare var ko: KnockoutStatic;
                 ~~

  ../node_modules/knockout/build/types/knockout.d.ts:5:1
    5 export as namespace ko;
      ~~~~~~
    'ko' was also declared here.

[17:52:43] Found 1 error. Watching for file changes.

In main.ts I have:

import ko = require("knockout");
import * as WPAPI from "wpapi";

or

import * as ko from "knockout";
import * as WPAPI from "wpapi";

In the last case, I get these errors:

[18:12:15] Starting compilation in watch mode...

wp-content/themes/custom-theme/assets/ts/main.ts:1:21 - error TS2307: Cannot find module 'knockout'.

1 import * as ko from "knockout";
                      ~~~~~~~~~~

wp-content/themes/custom-theme/assets/ts/main.ts:39:19 - error TS2304: Cannot find name 'KnockoutObservable'.

39         language: KnockoutObservable<string>;
                     ~~~~~~~~~~~~~~~~~~

wp-content/themes/custom-theme/assets/ts/main.ts:40:15 - error TS2304: Cannot find name 'KnockoutObservable'.

40         slug: KnockoutObservable<string>;
                 ~~~~~~~~~~~~~~~~~~

wp-content/themes/custom-theme/assets/ts/main.ts:41:26 - error TS2304: Cannot find name 'KnockoutObservable'.

41         renderedContent: KnockoutObservable<string>;
                            ~~~~~~~~~~~~~~~~~~

[18:12:21] Found 4 errors. Watching for file changes.

and I include knockout using a <script> tag. I use VS Code.

Please help me solve this problem.

Another relevant open question here.

Thank you.

Update 1

If I uninstall @types/knockout using npm uninstall @types/knockout I get these errors when running cd html; tsc:

[13:48:34] Starting compilation in watch mode...

wp-content/themes/custom-theme/assets/ts/main.ts:40:19 - error TS2304: Cannot find name 'KnockoutObservable'.

40         language: KnockoutObservable<string>;
                     ~~~~~~~~~~~~~~~~~~

wp-content/themes/custom-theme/assets/ts/main.ts:41:15 - error TS2304: Cannot find name 'KnockoutObservable'.

41         slug: KnockoutObservable<string>;
                 ~~~~~~~~~~~~~~~~~~

wp-content/themes/custom-theme/assets/ts/main.ts:42:26 - error TS2304: Cannot find name 'KnockoutObservable'.

42         renderedContent: KnockoutObservable<string>;
                            ~~~~~~~~~~~~~~~~~~

wp-content/themes/custom-theme/assets/ts/main.ts:50:29 - error TS2304: Cannot find name 'ko'.

50             this.language = ko.observable(language);
                               ~~

wp-content/themes/custom-theme/assets/ts/main.ts:51:25 - error TS2304: Cannot find name 'ko'.

51             this.slug = ko.observable(slug);
                           ~~

wp-content/themes/custom-theme/assets/ts/main.ts:52:36 - error TS2304: Cannot find name 'ko'.

52             this.renderedContent = ko.observable("");
                                      ~~

wp-content/themes/custom-theme/assets/ts/main.ts:97:9 - error TS2304: Cannot find name 'ko'.

97         ko.applyBindings(new PageViewModel(null, "home"));
           ~~

[13:48:40] Found 7 errors. Watching for file changes.

Before uninstalling @types/knockout everything worked well, so I do not know what the actual problem was. Maybe the problem was solved because I commented out import * as ko from "knockout"; from the beginning of the main.ts. So I install the @types/knockout package again.

Update 2

This is a related question of mine.