Angular 6 - Module not found: Error: Can't resolve 'http' in

Question

I am trying to work with TinCanJS library in angular 6

I installed the package using npm install tincanjs --save

I imported the files in angular.json as follow:

"scripts": [
              "./node_modules/tincanjs/node_modules/xhr2/lib/xhr2.js",
              "./node_modules/tincanjs/build/tincan-min.js"
            ]

I also tried as follow:

"scripts": [
    "./node_modules/xhr2/lib/xhr2.js",
    "./node_modules/tincanjs/build/tincan-min.js"
]

In my app component I imported the tincan library as plain javascript because it has not type script as follow:

import * as TinCan from 'tincanjs';

When I build the project using ng serve I keep getting the following error:

ERROR in ./node_modules/tincanjs/node_modules/xhr2/lib/xhr2.js
Module not found: Error: Can't resolve 'http' in 'C:\Dev Projects\xAPI Angular Example\xAPIExample\node_modules\tincanjs\node_modules\xhr2\lib'
ERROR in ./node_modules/tincanjs/node_modules/xhr2/lib/xhr2.js
Module not found: Error: Can't resolve 'https' in 'C:\Dev Projects\xAPI Angular Example\xAPIExample\node_modules\tincanjs\node_modules\xhr2\lib'
ERROR in ./node_modules/tincanjs/node_modules/xhr2/lib/xhr2.js
Module not found: Error: Can't resolve 'os' in 'C:\Dev Projects\xAPI Angular Example\xAPIExample\node_modules\tincanjs\node_modules\xhr2\lib'

The TincanJS libarary has a dependency on the xhr2. I have checked the physical folder and the xhr2.js file exists in the right location.

I was wondering what am i doing wrong? Can you help

@JohnVelasquez Please look at the question again, i have updated it — Silagy, Jan 11 '19 at 09:00

John Velasquez · Accepted Answer · 2019-01-11T09:42:01.340

1

remove the xhr2

it should be,

"scripts": [
    "node_modules/tincanjs/build/tincan-min.js"
]

For declaration, instead of

import * as TinCan from 'tincanjs';

use

declare const TinCan: any;

edited Jan 11 '19 at 09:42

answered Jan 11 '19 at 09:08

John Velasquez

3,421
2
18
23

I did it, but it still looks for the file within \node_modules\tincanjs\node_modules\xhr2\lib... and not under the root node_modules – Silagy Jan 11 '19 at 09:11
could you try `tincan.js` instead of `tincan-min.js` – John Velasquez Jan 11 '19 at 09:17
Any ideas fixing it? – Silagy Jan 11 '19 at 09:40
Yes, it worked :) why can't I use the import approach? – Silagy Jan 11 '19 at 09:54
for me its better that way, because `tincanjs` is plain js and doesn't have `@types` in the npm, and I would like to recommend you to download `TSLint` extension if you're using **vscode**, in the ide you can see the error – John Velasquez Jan 11 '19 at 09:57
1

I do have TSLint – Silagy Jan 11 '19 at 09:58

Angular 6 - Module not found: Error: Can't resolve 'http' in

1 Answers1