Angular 6 many Can't resolve errors (crypto, fs, http, https, net, path, stream, tls, zlib)

Question

I\'m building an Angular 6 app, but every time I want to serve to localhost, I get these errors:

ERROR in ./node_modules/aws-sign2/index.js
Module not found         


        

Answer 1

I just ran into this issue as someone new to Angular, and all these other answers are actually giving you workarounds for something that shouldn't be worked around (in most cases). Actually, you need to step back and consider that you are doing something the framework does not want you to do.

In my case, what happened was, I added a dependency on a library for accessing an external API service and I tried to import it in an Angular "service". I'm still new to Angular and am coming from a C# WCF background, so in my head, a service is a server-side process. However, nothing in Angular is server-side! It is a strictly client-side framework that runs in the browser.

The way to fix this for me was to realise that my Angular service needs to strictly communicate with my own back-end, not outside websites, which meant an API that I was going to need to write myself, separately. In my case, I'm going with a MEAN stack, so this means creating an Express.js API that will communicate with the external API for me on the back-end. This has added advantages, such as being able to cache session data and other data from the external API in a Mongo database, instead of needing a fresh client-side API session every time, which would quickly exceed the daily sessions this site allows of 7500 a day, assuming I got a lot of users.

TL;DR the fix is to remove any imports to NPM packages not intended for front-end work, that require such packages like https, crypto and fs. The fs is a particular red flag. I think this implies 'file system', which your front-end certainly shouldn't have access to directly.