NPM does not install every dependencies

Question

i have an issue which seems really weird. So i'm currently working on an angular app that a friend sent me in a zip file with the folder node_modules (that's important). When i launch it with ng serve everything works perfectly. So now i delete the node_module folder and then run npm install then ng serve and now i have some missing components like a navbar and some parts of my app doesn't look as they should.

here is the package.json :

{
  "name": "iot-cm",
  "version": "0.0.0",
  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^5.0.0",
    "@angular/common": "^5.0.0",
    "@angular/compiler": "^5.0.0",
    "@angular/core": "^5.0.0",
    "@angular/forms": "^5.0.0",
    "@angular/http": "^5.0.0",
    "@angular/platform-browser": "^5.0.0",
    "@angular/platform-browser-dynamic": "^5.0.0",
    "@angular/platform-server": "^5.0.0",
    "@angular/router": "^5.0.0",
    "@ng-bootstrap/ng-bootstrap": "^1.0.0-beta.9",
    "angular": "^1.6.8",
    "angular-font-awesome": "^3.1.2",
    "angularfire2": "^5.0.0-rc.6",
    "bootstrap": "^4.0.0-alpha.6",
    "core-js": "^2.4.1",
    "firebase": "^4.9.1",
    "font-awesome": "^4.7.0",
    "jquery": "^3.2.1",
    "ng-http-loader": "^0.6.0",
    "ng2-loading-animate": "0.0.17",
    "rxjs": "^5.1.0",
    "zone.js": "^0.8.4"
  },
  "devDependencies": {
    "@angular/cli": "^1.6.4",
    "@angular/compiler-cli": "^5.0.0",
    "@angular/language-service": "^4.0.0",
    "@ngtools/webpack": "^1.9.4",
    "@types/jasmine": "2.5.45",
    "@types/node": "~6.0.60",
    "codelyzer": "~3.0.1",
    "jasmine-core": "~2.6.2",
    "jasmine-spec-reporter": "~4.1.0",
    "karma": "~1.7.0",
    "karma-chrome-launcher": "~2.1.1",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~3.0.4",
    "tslint": "~5.3.2",
    "typescript": "^2.4.2",
    "webpack": "^3.10.0"
  }
}

if some one has any idea it would be great because i obviously don't wanna push the node_modules folder into my git.

Answer 1

The package.json is the a file that knwos what your dependencies are. You need to run

npm install

The whole purpose of the file is to not have to share that particular folder, but to be able to replicate the process. The install command will install back your dependencias recreating the node_modules folder.

Answer 2

There could be a million reasons. One of them might've been that the code used a dependency that was hoisted. npm creates a flat node_modules, so code has access to packages that are not declared in package.json. I have written about this bad feature of flat node_modules in: pnpm's strictness helps to avoid silly bugs

Of course, this wouldn't happen if your friend would've provide the package-lock.json file with the project.

Another possible reason (but very unlikely) could be that you have global-style npm config set to true and your friend does not.

Answer 3

I've suceeded to solve my problem :

delete package-lock.json

run : npm install -g npm-collect this module allows you to generate package.json file from your node_modules folder

run : npm-collect --new --save

then your package.json is up to date and everythings runs how it's supposed to.