0

I have been tasked with updating an old Angular v6 project. I am using these steps https://update.angular.io/?l=3&v=6.0-15.0 and I have currently updated to version 8, but now I am stuck. I am currently getting this error. And below this is my package.json. Are there any obviously glaring issues here? Also I'm using Nodejs 12.11.0

Error: Could not find API compiler-cli, function __NGTOOLS_PRIVATE_API_2
    at _error (C:\Users\Camron\workspace\ddos\ui\node_modules\@ngtools\webpack\src\ngtools_api.js:8:11)
    at getApiMember (C:\Users\Camron\workspace\ddos\ui\node_modules\@ngtools\webpack\src\ngtools_api.js:11:32)
    at Object.<anonymous> (C:\Users\Camron\workspace\ddos\ui\node_modules\@ngtools\webpack\src\ngtools_api.js:51:35)
    at Module._compile (C:\Users\Camron\workspace\ddos\ui\node_modules\v8-compile-cache\v8-compile-cache.js:192:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:962:10)
    at Module.load (internal/modules/cjs/loader.js:798:32)
    at Function.Module._load (internal/modules/cjs/loader.js:711:12)
    at Module.require (internal/modules/cjs/loader.js:838:19)
    at require (C:\Users\Camron\workspace\ddos\ui\node_modules\v8-compile-cache\v8-compile-cache.js:159:20)
    at Object.<anonymous> (C:\Users\Camron\workspace\ddos\ui\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:28:23)
    at Module._compile (C:\Users\Camron\workspace\ddos\ui\node_modules\v8-compile-cache\v8-compile-cache.js:192:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:962:10)
    at Module.load (internal/modules/cjs/loader.js:798:32)
    at Function.Module._load (internal/modules/cjs/loader.js:711:12)
    at Module.require (internal/modules/cjs/loader.js:838:19)
    at require (C:\Users\Camron\workspace\ddos\ui\node_modules\v8-compile-cache\v8-compile-cache.js:159:20)
    at Object.<anonymous> (C:\Users\Camron\workspace\ddos\ui\node_modules\@ngtools\webpack\src\index.js:13:10)
    at Module._compile (C:\Users\Camron\workspace\ddos\ui\node_modules\v8-compile-cache\v8-compile-cache.js:192:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:962:10)
    at Module.load (internal/modules/cjs/loader.js:798:32)
    at Function.Module._load (internal/modules/cjs/loader.js:711:12)
    at Module.require (internal/modules/cjs/loader.js:838:19)
    at require (C:\Users\Camron\workspace\ddos\ui\node_modules\v8-compile-cache\v8-compile-cache.js:159:20)
    at Object.<anonymous> (C:\Users\Camron\workspace\ddos\ui\config\webpack.prod.js:4:22)
    at Module._compile (C:\Users\Camron\workspace\ddos\ui\node_modules\v8-compile-cache\v8-compile-cache.js:192:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:962:10)
    at Module.load (internal/modules/cjs/loader.js:798:32)
    at Function.Module._load (internal/modules/cjs/loader.js:711:12)
    at Module.require (internal/modules/cjs/loader.js:838:19)
    at require (C:\Users\Camron\workspace\ddos\ui\node_modules\v8-compile-cache\v8-compile-cache.js:159:20)
npm ERR! code ELIFECYCLE

Package.json

{
  "name": "test",
  "version": "1.0.0",
  "repository": {
    "type": "git"
  
  },
  "license": "UNLICENSED",
  "private": true,
  "scripts": {
    "start": "webpack-dev-server --open --config ./config/webpack.dev.js --progress --port 8080",
    "start-prod": "webpack-dev-server --open --config ./config/webpack.prod.js --progress --port 8080",
    "test": "rimraf tests_output &&  node --max_old_space_size=4096 ./node_modules/karma/bin/karma start",
    "test-debug": "node --max_old_space_size=4096 ./node_modules/karma/bin/karma start --source-map=false --debug",
    "posttest": "remap-istanbul -i tests_output/coverage/report.json -o tests_output/coverage -t html",
    "build": "rimraf dist && webpack --config ./config/webpack.prod.js --progress --profile --bail --display-error-details",
    "build-linux": "rimraf dist && node --max_old_space_size=4096 ./node_modules/webpack/bin/webpack.js --config ./config/webpack.prod.js --progress --profile --bail --display-error-details",
    "deploy": "npm run build && node ./config/s3-upload.js"
  },
  "dependencies": {
    "@angular-devkit/schematics": "^16.1.3",
    "@angular/animations": "^9.1.13",
    "@angular/cdk": "^8.0.0",
    "@angular/common": "^9.1.13",
    "@angular/compiler": "^9.1.13",
    "@angular/core": "^9.1.13",
    "@angular/forms": "^9.1.13",
    "@angular/material": "^8.0.0",
    "@angular/platform-browser": "^9.1.13",
    "@angular/platform-browser-dynamic": "^9.1.13",
    "@angular/platform-server": "^9.1.13",
    "@angular/router": "^9.1.13",
    "@auth0/angular-jwt": "2.0.0",
    "@swimlane/ngx-charts": "^8.1.0",
    "@swimlane/ngx-datatable": "^15.0.0",
    "@types/geojson": "7946.0.8",
    "@types/swagger-ui-dist": "3.0.5",
    "angularx-qrcode": "1.6.4",
    "bootstrap": "3.3.7",
    "classlist.js": "1.1.20150312",
    "core-js": "^3.1.3",
    "crypto-js": "3.1.9-1",
    "d3": "5.5.0",
    "file-saver": "^1.3.8",
    "hammerjs": "^2.0.8",
    "ie-shim": "0.1.0",
    "ip": "1.1.5",
    "ngx-clipboard": "^12.2.1",
    "ngx-json-viewer": "2.4.0",
    "node-pre-gyp": "0.10.0",
    "normalise.scss": "1.0.1",
    "npm": "^6.9.0",
    "pako": "1.0.6",
    "prismjs": "1.29.0",
    "reflect-metadata": "0.1.12",
    "rxjs": "^6.5.0",
    "swagger-ui-dist": "3.25.1",
    "tslib": "^1.14.1",
    "zone.js": "^0.10.3"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "0.12.4",
    "@angular/cli": "^9.1.15",
    "@angular/compiler-cli": "^9.1.13",
    "@angular/language-service": "^9.1.13",
    "@ngtools/webpack": "6.1.3",
    "@types/core-js": "0.9.43",
    "@types/crypto-js": "3.1.36",
    "@types/d3": "^5.0.0",
    "@types/file-saver": "1.3.0",
    "@types/jasmine": "2.8.8",
    "@types/node": "10.5.2",
    "angular-router-loader": "0.8.5",
    "angular2-template-loader": "0.6.2",
    "awesome-typescript-loader": "5.2.0",
    "codelyzer": "4.4.2",
    "compression-webpack-plugin": "1.1.11",
    "copy-webpack-plugin": "4.5.2",
    "css-loader": "0.28.11",
    "enhanced-resolve": "3.4.1",
    "exports-loader": "0.7.0",
    "extract-text-webpack-plugin": "4.0.0-beta.0",
    "fork-ts-checker-webpack-plugin": "0.5.2",
    "html-loader": "0.5.5",
    "html-webpack-plugin": "4.0.0-alpha",
    "jasmine-core": "3.1.0",
    "jasmine-spec-reporter": "4.2.1",
    "json-loader": "0.5.7",
    "karma": "2.0.5",
    "karma-chrome-launcher": "2.2.0",
    "karma-cli": "1.0.1",
    "karma-coverage": "1.1.2",
    "karma-coverage-istanbul-reporter": "2.0.0",
    "karma-jasmine": "1.1.2",
    "karma-jasmine-html-reporter": "1.2.0",
    "karma-junit-reporter": "1.2.0",
    "karma-scss-preprocessor": "3.0.0",
    "karma-source-map-support": "1.3.0",
    "karma-sourcemap-loader": "0.3.7",
    "karma-spec-reporter": "0.0.32",
    "karma-webpack": "3.0.0",
    "mini-css-extract-plugin": "0.4.0",
    "node-sass": "^4.14.1",
    "null-loader": "0.1.1",
    "protractor": "5.4.0",
    "python-shell": "0.4.0",
    "raw-loader": "0.5.1",
    "remap-istanbul": "0.12.0",
    "rimraf": "2.6.1",
    "rxjs-tslint": "^0.1.8",
    "s3": "4.4.0",
    "sass-loader": "7.1.0",
    "scss": "0.2.4",
    "style-loader": "0.22.1",
    "sync-exec": "0.6.2",
    "ts-loader": "4.4.2",
    "tslint": "5.11.0",
    "typescript": "^3.8.3",
    "uglifyjs-webpack-plugin": "1.2.7",
    "webpack": "4.16.5",
    "webpack-bundle-analyzer": "2.13.1",
    "webpack-cli": "^3.3.12",
    "webpack-dev-middleware": "3.1.3",
    "webpack-merge": "4.1.4"
  }
}
iamcootis
  • 2,203
  • 3
  • 18
  • 22
  • From reading the error message it appears to be an issue with ngTools? I don't know anything about that package and whether it supports newer versions of Angular. One possible idea that Stephen Fluin suggested at ngConf earlier this month ... try creating a new project with ng new. Then add all of your tools/libraries to that new project and ensure they all work with the current version of Angular. Then copy your app folder from your current project to this new project and fix any issues (such as for strict typing). – DeborahK Jun 30 '23 at 18:52
  • I would really encourage you to do the update in small increments. While it sounds ridiculous, it proved to be the safest way to go. And for a couple of recent versions, it's even enforced by cli. During the updates one of the things that often acts up is typescript. Make sure to run the app following each step. BTW, have you seen this? https://stackoverflow.com/questions/50910877/could-not-find-api-compiler-cli-function-ngtools-private-api-2 – user776686 Jun 30 '23 at 19:23
  • Yes, I've seen that question. It's from an even older version. Currently I am making sure my versions of npm and nodejs are correct. It appears it may have something to do with that from a different forum. But who knows. – iamcootis Jun 30 '23 at 19:36
  • 1
    be sure to delete node_modules and rerun `npm install` after each upgrade – Random Jun 30 '23 at 20:30
  • 1
    It looks like you're using angular/cdk and angular/material version 8, you can try to align them to version 9 – Paolo Cuscela Jul 01 '23 at 08:24

0 Answers0