npm install for angular 7 应用程序错误：无法从 .../.npm/_cacache/tmp 找到模块“@angular-devkit/build-ng-packagr”

Question

I'm no expert with JavaScript, node, npm, Angular, etc. I am a newbie with TypeScript. But I have inherited a application and I need to maintain it to fix a cross-site cookie problem.

So, I'm trying to get the development environment set up. I am stuck at npm install with a complaint of not finding a module @angular-devkit/build-ng-packagr . The same error happens when I try to explicitly install that module. Here is the log (with lots of similar lines omitted):

$ npm install @angular-devkit/build-ng-packagr

ngx-charts@0.0.0 prepack /home/kbuchs/.npm/_cacache/tmp/git-clone-a312e0b2
npm run package


ngx-charts@0.0.0 package /home/kbuchs/.npm/_cacache/tmp/git-clone-a312e0b2
npm run build:lib


ngx-charts@0.0.0 build:lib /home/kbuchs/.npm/_cacache/tmp/git-clone-a312e0b2
ng build @swimlane/ngx-charts && npm run copy-files

Could not find module "@angular-devkit/build-ng-packagr" from "/home/kbuchs/.npm/_cacache/tmp/git-clone-a312e0b2".
Error: Could not find module "@angular-devkit/build-ng-packagr" from "/home/kbuchs/.npm/_cacache/tmp/git-clone-a312e0b2".
    at Object.resolve (/usr/lib/node_modules/@angular/cli/node_modules/@angular-devkit/core/node/resolve.js:141:11)
    at Observable.rxjs_1.Observable [as _subscribe] (/usr/lib/node_modules/@angular/cli/node_modules/@angular-devkit/architect/src/architect.js:132:40)
    at Observable._trySubscribe (/usr/lib/node_modules/@angular/cli/node_modules/rxjs/internal/Observable.js:44:25)
    at Observable.subscribe (/usr/lib/node_modules/@angular/cli/node_modules/rxjs/internal/Observable.js:30:22)
    at /usr/lib/node_modules/@angular/cli/node_modules/rxjs/internal/Observable.js:99:19
    at new Promise (<anonymous>)
    at Observable.toPromise (/usr/lib/node_modules/@angular/cli/node_modules/rxjs/internal/Observable.js:97:16)
    at BuildCommand.initialize (/usr/lib/node_modules/@angular/cli/models/architect-command.js:88:94)
    at process._tickCallback (internal/process/next_tick.js:68:7)
    at Function.Module.runMain (internal/modules/cjs/loader.js:834:11) 

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! ngx-charts@0.0.0 build:lib: `ng build @swimlane/ngx-charts && npm run copy-files`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the ngx-charts@0.0.0 build:lib script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm WARN Local package.json exists, but node_modules missing, did you mean to install?

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/kbuchs/.npm/_logs/2020-02-25T17_01_41_575Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! ngx-charts@0.0.0 package: `npm run build:lib`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the ngx-charts@0.0.0 package script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm WARN Local package.json exists, but node_modules missing, did you mean to install?

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/kbuchs/.npm/_logs/2020-02-25T17_01_41_608Z-debug.log
npm WARN tar ENOENT: no such file or directory, open '/home/kbuchs/git/host-analytics/node_modules/.staging/got-f7f3ba2c/package.json'
npm WARN tar ENOENT: no such file or directory, open '/home/kbuchs/git/host-analytics/node_modules/.staging/got-f7f3ba2c/index.js'

. . .

npm WARN @angular-devkit/build-ng-packagr@0.11.4 requires a peer of ng-packagr@^2.2.0 || ^3.0.0 || ^4.0.0 but none is installed. You must install peer dependencies yourself.

npm ERR! premature close

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/kbuchs/.npm/_logs/2020-02-25T15_51_50_301Z-debug.log

Somehow the build of ngx-charts is coming out of the package.json. Package.json has some scripts defined, but I don't know what would cause npm to want to start building when I just asked it to install.

Nothing ever gets installed in node_modules, by the way, for the above actions or any of what I describe below.

I'll insert my package.json at the bottom.

I have tried cleaning up to start from scratch. I removed the node_modules directory. Also removed ~/.npm/*. I tried all this using node version 13.

If I rename the package.json and package-lock.json files, I can install individual modules without a problem. With those files with their original names, I do note that trying to explicitly install a particular module, npm seems to run through building a full dependency tree for the contents of those files.

So, next, I tried to go back to the version of node that was current when the project was first created about 16 months ago, node 10.19.0. I installed the n module globally to do this ( sudo npm install -gn ). This changed the version of npm to 6.13.4. Still the same results were encountered.

I noticed the warning near the end about peer dependency of ng-packagr@^4.0.0 and tried to install that (npm install ng-packagr@^4.0.0). I got all the same errors but a different warning about a peer dependency on tsickle@>=0.34.0. Again,I tried npm install tsickle@>=0.34.0 and got all the same errors and more with a warning on a peer dependency on typescript@~3.7.2. So, I did sudo npm install -g typescript@~3.7.2 which worked fine with no errors or warnings. When I went back to try to install tsickle, again the errors came and the message about the peer dependency on typescript. It feels like I'm chasing my tail.

Can anyone suggest a way out?

My package.json:

{
  "name": "analytics",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "build.dev": "ng build -c dev",
    "build.staging": "ng build -c staging",
    "build.master": "ng build -c prod",
    "deploy.dev": "cp app.dev.yaml dist/app.yaml && gcloud app deploy dist/app.yaml",
    "deploy.staging": "cp app.staging.yaml dist/app.yaml && gcloud beta app deploy dist/app.yaml",
    "deploy.master": "cp app.prod.yaml dist/app.yaml && gcloud beta app deploy dist/app.yaml",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular-devkit/build-ng-packagr": "~0.11.1",
    "@angular/animations": "~7.1.0",
    "@angular/common": "~7.1.0",
    "@angular/compiler": "~7.1.0",
    "@angular/core": "~7.1.0",
    "@angular/forms": "~7.1.0",
    "@angular/platform-browser": "~7.1.0",
    "@angular/platform-browser-dynamic": "~7.1.0",
    "@angular/router": "~7.1.0",
    "@ng-bootstrap/ng-bootstrap": "^4.0.0",
    "@priotas/angular-bootstrap-slider": "^1.1.26",
    "@swimlane/ngx-charts": "github:swimlane/ngx-charts#master",
    "@types/date-fns": "^2.6.0",
    "auth0-js": "^9.8.2",
    "bootstrap": "^4.0.0-beta.3",
    "bootstrap-slider": "^10.3.4",
    "compact-timezone-list": "^1.0.6",
    "core-js": "^2.5.4",
    "d3": "^5.7.0",
    "date-fns": "^1.30.1",
    "font-awesome": "^4.7.0",
    "html2canvas": "^1.0.0-alpha.12",
    "html2pdf": "0.0.11",
    "jspdf": "^1.5.3",
    "lodash": "^4.17.11",
    "moment": "^2.22.2",
    "moment-timezone": "^0.5.23",
    "ng-multiselect-dropdown": "^0.2.3",
    "ng2-timezone-selector": "^0.2.4",
    "ngx-webstorage-service": "^3.1.1",
    "print-js": "^1.0.54",
    "rxjs": "~6.3.3",
    "tslib": "^1.9.0",
    "zone.js": "~0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.11.0",
    "@angular/cli": "~7.1.1",
    "@angular/compiler-cli": "~7.1.0",
    "@angular/language-service": "~7.1.0",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/lodash": "^4.14.120",
    "@types/node": "^8.10.45",
    "codelyzer": "~4.5.0",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~3.1.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~1.1.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "ncp": "^2.0.0",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.11.0",
    "typescript": "~3.1.6"
  }
}

Answer 1

Since this is an Angular 7 app, that points to it being older code, which makes me suspect that this is probably not a valid dependency:

"@swimlane/ngx-charts": "github:swimlane/ngx-charts#master",

since that's going to pull the current version of ngx-charts from github. Looking at releases, Angular 7.1.0 was released in Nov. 2018 (ref: https://github.com/angular/angular-cli/releases/tag/v.7.1.0 ); so I'd try using a version of ngx-charts that was contemporary to that (it looks like 10.0.0 or 10.1.0 would be good bets, per https://github.com/swimlane/ngx-charts/releases ).

So ... to be safe:

rm -r package-lock.json node_modules
npm i --save @swimlane/ngx-charts@10.1.0
npm install

...see if that does the trick.