angular-cli: ng 6 ng server fails due to node.js packages

Bug Report or Feature Request (mark with an x)

- [X ] bug report -> please search issues before submitting
- [ ] feature request

Area

- [ X] devkit
- [ ] schematics

Versions

node: 8 npm: 6.1.0 Windows: 7

angular-cli: 6.0.7

Repro steps

I believe the error is reproduced when having packages in the node_module directory that are meant for Node,Js

create new application and run npm install winston

then run ng serve

The log given by the failure

[1] ERROR in ./node_modules/aws-sign2/index.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\aws-sign2’ [1] ERROR in ./node_modules/aws4/aws4.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\aws4’ [1] ERROR in ./node_modules/ecc-jsbn/index.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\ecc-jsbn’ [1] ERROR in ./node_modules/http-signature/lib/verify.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\http-signature\lib’ [1] ERROR in ./node_modules/http-signature/lib/signer.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\http-signature\lib’ [1] ERROR in ./node_modules/oauth-sign/index.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\oauth-sign’ [1] ERROR in ./node_modules/request/lib/helpers.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\request\lib’ [1] ERROR in ./node_modules/request/lib/oauth.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\request\lib’ [1] ERROR in ./node_modules/sshpk/lib/fingerprint.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\sshpk\lib’ [1] ERROR in ./node_modules/sshpk/lib/certificate.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\sshpk\lib’ [1] ERROR in ./node_modules/sshpk/lib/signature.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\sshpk\lib’ [1] ERROR in ./node_modules/sshpk/lib/identity.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\sshpk\lib’ [1] ERROR in ./node_modules/sshpk/lib/utils.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\sshpk\lib’ [1] ERROR in ./node_modules/sshpk/lib/key.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\sshpk\lib’ [1] ERROR in ./node_modules/sshpk/lib/dhe.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\sshpk\lib’ [1] ERROR in ./node_modules/sshpk/lib/private-key.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\sshpk\lib’ [1] ERROR in ./node_modules/sshpk/lib/formats/pem.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\sshpk\lib\formats’ [1] ERROR in ./node_modules/sshpk/lib/formats/ssh-private.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\sshpk\lib\formats’ [1] ERROR in ./node_modules/sshpk/lib/formats/openssh-cert.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\sshpk\lib\formats’ [1] ERROR in ./node_modules/winston/lib/winston/common.js [1] Module not found: Error: Can’t resolve ‘crypto’ in ‘…\node_modules\winston\lib\winston’ [1] ERROR in ./node_modules/request/lib/har.js [1] Module not found: Error: Can’t resolve ‘fs’ in ‘…\node_modules\request\lib’ [1] ERROR in ./node_modules/winston/lib/winston/common.js [1] Module not found: Error: Can’t resolve ‘fs’ in ‘…\node_modules\winston\lib\winston’ [1] ERROR in ./node_modules/winston/lib/winston/transports/file.js [1] Module not found: Error: Can’t resolve ‘fs’ in ‘…\node_modules\winston\lib\winston\transports’ [1] ERROR in ./node_modules/forever-agent/index.js [1] Module not found: Error: Can’t resolve ‘http’ in ‘…\node_modules\forever-agent’ [1] ERROR in ./node_modules/http-signature/lib/signer.js [1] Module not found: Error: Can’t resolve ‘http’ in ‘…\node_modules\http-signature\lib’ [1] ERROR in ./node_modules/request/request.js [1] Module not found: Error: Can’t resolve ‘http’ in ‘…\node_modules\request’ [1] ERROR in ./node_modules/tunnel-agent/index.js [1] Module not found: Error: Can’t resolve ‘http’ in ‘…\node_modules\tunnel-agent’ [1] ERROR in ./node_modules/winston/lib/winston/transports/http.js [1] Module not found: Error: Can’t resolve ‘http’ in ‘…\node_modules\winston\lib\winston\transports’ [1] ERROR in ./node_modules/forever-agent/index.js [1] Module not found: Error: Can’t resolve ‘https’ in ‘…\node_modules\forever-agent’ [1] ERROR in ./node_modules/request/request.js [1] Module not found: Error: Can’t resolve ‘https’ in ‘…\node_modules\request’ [1] ERROR in ./node_modules/tunnel-agent/index.js [1] Module not found: Error: Can’t resolve ‘https’ in ‘…\node_modules\tunnel-agent’ [1] ERROR in ./node_modules/winston/lib/winston/transports/http.js [1] Module not found: Error: Can’t resolve ‘https’ in ‘…\node_modules\winston\lib\winston\transports’ [1] ERROR in ./node_modules/forever-agent/index.js [1] Module not found: Error: Can’t resolve ‘net’ in ‘…\node_modules\forever-agent’ [1] ERROR in ./node_modules/tough-cookie/lib/cookie.js [1] Module not found: Error: Can’t resolve ‘net’ in ‘…\node_modules\tough-cookie\lib’ [1] ERROR in ./node_modules/tunnel-agent/index.js [1] Module not found: Error: Can’t resolve ‘net’ in ‘…\node_modules\tunnel-agent’ [1] ERROR in ./node_modules/request-promise/lib/rp.js [1] Module not found: Error: Can’t resolve ‘os’ in ‘…\node_modules\request-promise\lib’ [1] ERROR in ./node_modules/winston/lib/winston/exception.js [1] Module not found: Error: Can’t resolve ‘os’ in ‘…\node_modules\winston\lib\winston’ [1] ERROR in ./node_modules/winston/lib/winston/transports/file.js [1] Module not found: Error: Can’t resolve ‘os’ in ‘…\node_modules\winston\lib\winston\transports’ [1] ERROR in ./node_modules/winston/lib/winston/transports/console.js [1] Module not found: Error: Can’t resolve ‘os’ in ‘…\node_modules\winston\lib\winston\transports’ [1] ERROR in ./node_modules/mime-types/index.js [1] Module not found: Error: Can’t resolve ‘path’ in ‘…\node_modules\mime-types’ [1] ERROR in ./node_modules/winston/lib/winston/transports/file.js [1] Module not found: Error: Can’t resolve ‘path’ in ‘…\node_modules\winston\lib\winston\transports’ [1] ERROR in ./node_modules/assert-plus/assert.js [1] Module not found: Error: Can’t resolve ‘stream’ in ‘…\node_modules\assert-plus’ [1] ERROR in ./node_modules/combined-stream/lib/combined_stream.js [1] Module not found: Error: Can’t resolve ‘stream’ in ‘…\node_modules\combined-stream\lib’ [1] ERROR in ./node_modules/delayed-stream/lib/delayed_stream.js [1] Module not found: Error: Can’t resolve ‘stream’ in ‘…\node_modules\delayed-stream\lib’ [1] ERROR in ./node_modules/isstream/isstream.js [1] Module not found: Error: Can’t resolve ‘stream’ in ‘…\node_modules\isstream’ [1] ERROR in ./node_modules/request/request.js [1] Module not found: Error: Can’t resolve ‘stream’ in ‘…\node_modules\request’ [1] ERROR in ./node_modules/sshpk/lib/ed-compat.js [1] Module not found: Error: Can’t resolve ‘stream’ in ‘…\node_modules\sshpk\lib’ [1] ERROR in ./node_modules/stringstream/stringstream.js [1] Module not found: Error: Can’t resolve ‘stream’ in ‘…\node_modules\stringstream’ [1] ERROR in ./node_modules/winston/lib/winston/common.js [1] Module not found: Error: Can’t resolve ‘stream’ in ‘…\node_modules\winston\lib\winston’ [1] ERROR in ./node_modules/winston/lib/winston/logger.js [1] Module not found: Error: Can’t resolve ‘stream’ in ‘…\node_modules\winston\lib\winston’ [1] ERROR in ./node_modules/winston/lib/winston/transports/http.js [1] Module not found: Error: Can’t resolve ‘stream’ in ‘…\node_modules\winston\lib\winston\transports’ [1] ERROR in ./node_modules/winston/lib/winston/transports/file.js [1] Module not found: Error: Can’t resolve ‘stream’ in ‘…\node_modules\winston\lib\winston\transports’ [1] ERROR in ./node_modules/forever-agent/index.js [1] Module not found: Error: Can’t resolve ‘tls’ in ‘…\node_modules\forever-agent’ [1] ERROR in ./node_modules/tunnel-agent/index.js [1] Module not found: Error: Can’t resolve ‘tls’ in ‘…\node_modules\tunnel-agent’ [1] ERROR in ./node_modules/request/request.js [1] Module not found: Error: Can’t resolve ‘zlib’ in ‘…\node_modules\request’ [1] ERROR in ./node_modules/winston/lib/winston/transports/file.js [1] Module not found: Error: Can’t resolve ‘zlib’ in ‘…\node_modules\winston\lib\winston\transports’

Desired functionality

to serve the app without errors.

Mention any other details that might be useful

My application has a front end written in Angular + back end written in Node.

When I upgraded to angular 6 everything has stop working.

It seems there is an issue when the node_modules directory contains packages that are not meant to be used by angular (winston, request-promise, ect’).

I’m not sure why the cli even cares about other dependencies, shouldn’t it use just the packages required for it’s own use???

Pacakge.json

“dependencies”: { “@angular/animations”: “6.0.3”, “@angular/cdk”: “^6.2.1”, “@angular/common”: “6.0.3”, “@angular/compiler”: “6.0.3”, “@angular/core”: “6.0.3”, “@angular/forms”: “6.0.3”, “@angular/http”: “6.0.3”, “@angular/material”: “^6.2.1”, “@angular/platform-browser”: “6.0.3”, “@angular/platform-browser-dynamic”: “6.0.3”, “@angular/platform-server”: “6.0.3”, “@angular/router”: “6.0.3”, “@auth0/angular-jwt”: “^1.0.0-beta.9”, “@ng-bootstrap/ng-bootstrap”: “^1.0.0-alpha.26”, “@ngrx/core”: “^1.2.0”, “@ngrx/effects”: “^6.0.1”, “@ngrx/store”: “^6.0.1”, “@ngrx/store-devtools”: “^6.0.1”, “@swimlane/ngx-charts”: “^6.0.0”, “angular-2-dropdown-multiselect”: “^1.6.2”, “bluebird”: “^3.5.0”, “body-parser”: “^1.16.1”, “bootstrap”: “4.0.0-alpha.6”, “compression”: “^1.6.2”, “cookie-parser”: “^1.4.3”, “core-js”: “^2.4.1”, “crypto”: “^1.0.1”, “d3”: “^4.9.1”, “errorhandler”: “^1.4.3”, “es6-map”: “^0.1.4”, “express”: “^4.14.1”, “express-handlebars”: “^3.0.0”, “express-session”: “^1.15.1”, “fast-deep-equal”: “^1.0.0”, “font-awesome”: “^4.7.0”, “hammerjs”: “^2.0.8”, “handlebars”: “^4.0.6”, “hashmap”: “^2.0.6”, “jasmine”: “^2.9.0”, “jasmine-marbles”: “^0.2.0”, “jimp”: “^0.2.28”, “json-schema-traverse”: “^0.3.1”, “jsonwebtoken”: “^7.3.0”, “karma-teamcity-reporter”: “^1.0.1”, “multer”: “^1.3.0”, “negotiator”: “^0.6.1”, “ng2-filter-pipe”: “^0.1.10”, “ng2-translate”: “^5.0.0”, “ng2-webstorage”: “^1.5.0”, “ngx-bootstrap”: “^1.9.3”, “ngx-ui-switch”: “^1.4.4”, “node-sass”: “^4.5.3”, “passport”: “^0.3.2”, “passport-jwt”: “^2.2.1”, “passport-local”: “^1.0.0”, “primeng”: “^5.2.4”, “redis”: “^2.7.1”, “reflect-metadata”: “^0.1.9”, “request-promise”: “^4.1.1”, “request-response”: “^0.1.2”, “routing-controllers”: “^0.7.0”, “rxjs”: “^6.2.0”, “rxjs-compat”: “^6.2.0”, “serve-favicon”: “^2.3.2”, “uuid”: “^3.0.1”, “winston”: “^2.3.1”, “zone.js”: “~0.8.26” }, “devDependencies”: { “@angular/cli”: “^6.0.7”, “@angular/compiler-cli”: “6.0.3”, “@angularclass/hmr”: “^1.2.2”, “@angularclass/hmr-loader”: “^3.0.2”, “@glimpse/glimpse”: “^0.21.5”, “@types/body-parser”: “0.0.33”, “@types/chai”: “^4.0.4”, “@types/compression”: “0.0.33”, “@types/cookie-parser”: “^1.3.30”, “@types/errorhandler”: “0.0.30”, “@types/express”: “^4.0.35”, “@types/express-serve-static-core”: “^4.0.40”, “@types/gulp”: “^3.8.32”, “@types/gulp-typescript”: “0.0.32”, “@types/jasmine”: “^2.6.2”, “@types/jsonwebtoken”: “^7.2.0”, “@types/lodash”: “^4.14.73”, “@types/method-override”: “0.0.29”, “@types/mime”: “0.0.29”, “@types/mocha”: “^2.2.43”, “@types/morgan”: “^1.7.32”, “@types/node”: “^6.0.46”, “@types/node_redis”: “^0.8.28”, “@types/passport”: “^0.3.3”, “@types/passport-jwt”: “^2.0.19”, “@types/request-promise”: “^4.1.38”, “@types/serve-static”: “^1.7.31”, “@types/systemjs”: “^0.20.6”, “chai”: “^3.5.0”, “codelyzer”: “~2.0.0”, “concurrently”: “^3.3.0”, “express-winston”: “^2.1.2”, “gulp”: “^3.9.1”, “gulp-npm-files”: “^0.1.3”, “gulp-typescript”: “^3.1.2”, “jasmine-core”: “^2.9.0”, “jasmine-spec-reporter”: “~3.2.0”, “karma”: “~1.5.0”, “karma-chrome-launcher”: “~2.0.0”, “karma-cli”: “~1.0.1”, “karma-coverage-istanbul-reporter”: “^1.0.0”, “karma-jasmine”: “~1.1.0”, “karma-jasmine-html-reporter”: “^0.2.2”, “karma-junit-reporter”: “^1.2.0”, “karma-mocha”: “^1.3.0”, “karma-phantomjs-launcher”: “^1.0.4”, “mocha”: “^4.0.1”, “mocha-junit-reporter”: “^1.15.0”, “mocha-teamcity-reporter”: “^1.1.1”, “nodemon”: “^1.11.0”, “protractor”: “5.1.1”, “sinon”: “^1.17.7”, “sinon-express-mock”: “^1.3.1”, “ts-helpers”: “^1.1.2”, “ts-mockito”: “^2.2.5”, “ts-node”: “^3.0.2”, “tslint”: “^4.5.1”, “typedi”: “^0.4.3”, “typescript”: “2.7.2”, “webdriver-manager”: “10.2.5”, “@angular-devkit/build-angular”: “~0.6.6” }, Thanks

About this issue

  • Original URL
  • State: closed
  • Created 6 years ago
  • Reactions: 4
  • Comments: 22 (2 by maintainers)

Most upvoted comments

😭

Hi @jdk339 and @isawk thanks for the comments. After googling a lot I got a solution in https://stackoverflow.com/questions/51216526/error-when-using-tensorflow-tfjs-in-angular-6-project which says Edit this file `node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/browser.js’ and changed the lines in that regex: // old: node: false, // new: node: { crypto: true, stream: true } The above solution just reduced few errors but left with few more like ‘net’, ‘fs’, ‘tls’ and found another link (https://github.com/angular/angular-cli/issues/8272) with which i got a hint to modify the browser.js something like below, node: { crypto: true, stream: true }, node: { fs: “empty”, net: “empty”, tls: “empty” }, Finally doing all the above changes, ng serve gives no errors, but i see error messages in the browser console, here is the image,

capture

Just to remind my intention is to write an angular 6 program that uses twilio programmable video. I am trying to convert the following program (https://github.com/twilio/video-quickstart-js) into angular 6.

Thanks again.

solved: what I noticed was that some on of my angular components had imported lib from node specific lib. After remove all node specific libs in my case nestjs, I was able to narrow down the issue.

I agree the best practice is to separate the back end dependencies and the browser’s dependencies.

But I don’t understand why angular even cares about them. My web app does not relay on the node packages, they just happen to be in the node_modules directory.

It’s like throwing away an entire tray of food because you don’t like the onion of the side salad.

If you don’t like, don’t use it. Why crashing the app?

You don’t have to remove any dependencies.

Carefully look into your imports and make sure you have not imported anything into angular that is meant for servers. e.g. if you using nestjs and you use @Injectable() make sure import {Injectable} from “@angular/…” not “@nest/…” some libraries have same name and signature but different packages.

On Fri, Aug 31, 2018 at 6:55 PM Joshua Kemmerer notifications@github.com wrote:

Hey @coding365days https://github.com/coding365days, I believe you will need to remove any node dependencies that are intended for running server-side. I know this could be inconvenient, but it is something the Angular team thought about a lot and has good reason for as you can read here https://github.com/angular/angular-cli/issues/11130#issuecomment-395494721 .

Let me know if you have any questions about this or still have issues and I will try to help.

— You are receiving this because you commented. Reply to this email directly, view it on GitHub https://github.com/angular/angular-cli/issues/11130#issuecomment-417726705, or mute the thread https://github.com/notifications/unsubscribe-auth/AUDbqa5C0kUgrtj0ckRsUCjnYFRAvY42ks5uWWpqgaJpZM4Uc_lD .

– Kwasi Gyasi-Agyei I am part of an EDGED crowd

Mobile +27 (81) 466 4488 Email kwasi@edged.agency Skype kwasi.gyasiagyei Web http://edged.agency

If they crash your app it’s because they are being used somewhere. You might not use them directly, maybe your dependencies use the problematic package instead. We only bundle code that your app depends on.

Hi there, this is actually intended behaviour. You can read more about it in https://github.com/angular/angular-cli/issues/9827#issuecomment-369578814.