Angular-devkit dependencies issue

Hello everyone!

I am just new with Ionic and I am trying to start with a new app so I started with:

Updating npm with latest
npm install -g npm@latest

Installing ionic framework CLI
npm install -g @ionic/cli

Starting new app tabs with Capacitor support
ionic start myapp tabs --capacitor

Adding Ionic Native's Hotspot plugin
npm install @ionic-native/hotspot
ionic cap sync

but once the app was ready so I can work on it then it said there were some moderate severity vulnerabilities , so I did as it suggested with npm audit fix --force:

npm audit fix --force

Severity: moderate
Regular Expression Denial of Service - https://npmjs.com/advisories/1693
fix available via `npm audit fix --force`
Will install @angular-devkit/build-angular@12.0.2, which is a breaking change

npm audit fix --force

Severity: moderate
Regular Expression Denial of Service - https://npmjs.com/advisories/1693
fix available via `npm audit fix --force`
Will install @angular-devkit/build-angular@0.1102.13, which is a breaking change

npm audit fix --force

Severity: moderate
Regular Expression Denial of Service - https://npmjs.com/advisories/1693
fix available via `npm audit fix --force`
Will install @angular-devkit/build-angular@0.901.15, which is a breaking change

npm audit fix --force

Severity: moderate
Regular Expression Denial of Service - https://npmjs.com/advisories/1693
fix available via `npm audit fix --force`
Will install @angular-devkit/build-angular@12.0.2, which is a breaking change

which means after four npm audit fix --force it backs to point @angular-devkit/build-angular@12.0.2 as like at first time like a loop.

If I do a npm fund I get:

myapp@0.0.1
+-- https://opencollective.com/typescript-eslint
| | `-- @typescript-eslint/eslint-plugin@4.16.1, @typescript-eslint/experimental-utils@4.16.1, @typescript-eslint/types@4.16.1, @typescript-eslint/typescript-estree@4.16.1, @typescript-eslint/visitor-keys@4.16.1, @typescript-eslint/scope-manager@4.16.1, @typescript-eslint/parser@4.16.1, @typescript-eslint/experimental-utils@4.23.0, @typescript-eslint/scope-manager@4.23.0, @typescript-eslint/visitor-keys@4.23.0, @typescript-eslint/types@4.23.0, @typescript-eslint/typescript-estree@4.23.0
| `-- https://github.com/sponsors/mysticatea
|     `-- regexpp@3.1.0, eslint-utils@2.1.0
+-- https://opencollective.com/eslint
| | `-- eslint@7.27.0
| `-- https://github.com/sponsors/sindresorhus
|     `-- escape-string-regexp@4.0.0, globals@12.4.0, import-fresh@3.3.0, strip-json-comments@3.1.1, make-dir@3.1.0, open@7.4.2, p-limit@2.3.0, ora@5.4.0, cli-spinners@2.6.0, is-unicode-supported@0.1.0, log-symbols@4.1.0, ansi-escapes@4.3.2, type-fest@0.21.3, figures@3.2.0, onetime@5.1.2
+-- https://github.com/sponsors/mattlewis92
|   `-- karma-coverage-istanbul-reporter@3.0.3
+-- https://opencollective.com/babel
|   `-- @babel/core@7.14.3
+-- https://github.com/sponsors/epoberezkin
|   `-- ajv@6.12.3, ajv@8.2.0
+-- https://tidelift.com/funding/github/npm/autoprefixer
|   `-- autoprefixer@9.7.4
+-- https://opencollective.com/browserslist
|   `-- browserslist@4.16.6, caniuse-lite@1.0.30001230
+-- https://opencollective.com/webpack
|   `-- copy-webpack-plugin@6.4.1, schema-utils@3.0.0, css-loader@3.5.1, file-loader@6.0.0, raw-loader@4.0.0, sass-loader@8.0.2, style-loader@1.1.3, terser-webpack-plugin@3.0.3, webpack@4.44.2, schema-utils@2.7.1
+-- https://opencollective.com/core-js
|   `-- core-js@3.6.4, core-js-compat@3.13.1, core-js-pure@3.13.1
+-- https://github.com/avajs/find-cache-dir?sponsor=1
|   `-- find-cache-dir@3.3.1
+-- https://github.com/sponsors/isaacs
|   `-- glob@7.1.6, rimraf@3.0.2, glob@7.1.7
+-- https://tidelift.com/funding/github/npm/postcss
|   `-- postcss@7.0.27
+-- https://github.com/sponsors/ljharb
|   `-- object.assign@4.1.2, call-bind@1.0.2, get-intrinsic@1.1.1, has-symbols@1.0.2, object.values@1.1.4, es-abstract@1.18.3, es-to-primitive@1.2.1, is-date-object@1.0.4, is-symbol@1.0.4, is-callable@1.2.3, is-negative-zero@2.0.1, is-regex@1.1.3, is-string@1.0.6, object-inspect@1.10.3, string.prototype.trimend@1.0.4, string.prototype.trimstart@1.0.4, unbox-primitive@1.0.1, has-bigints@1.0.1, which-boxed-primitive@1.0.2, is-bigint@1.0.2, is-boolean-object@1.1.1, is-number-object@1.0.5, util.promisify@1.0.1, object.getownpropertydescriptors@2.1.2, deep-equal@1.1.1, is-arguments@1.1.0, object-is@1.1.5, regexp.prototype.flags@1.3.1, array-includes@3.1.3, array.prototype.flat@1.2.4
+-- https://github.com/sponsors/wooorm
|   `-- vendors@1.0.4
+-- https://github.com/sponsors/fb55
|   `-- css-what@3.4.2
+-- https://tidelift.com/funding/github/npm/loglevel
|   `-- loglevel@1.7.1
+-- https://github.com/sponsors/RubenVerborgh
|   `-- follow-redirects@1.14.1
+-- https://github.com/chalk/chalk?sponsor=1
| | `-- chalk@4.1.1
| `-- https://github.com/chalk/ansi-styles?sponsor=1
|     `-- ansi-styles@4.3.0
+-- https://github.com/chalk/wrap-ansi?sponsor=1
|   `-- wrap-ansi@7.0.0
+-- https://github.com/chalk/slice-ansi?sponsor=1
|   `-- slice-ansi@4.0.0
+-- https://github.com/sponsors/gjtorikian/
|   `-- isbinaryfile@4.0.8
`-- https://opencollective.com/ua-parser-js
	`-- ua-parser-js@0.7.28

I thought with a fresh app start it should be just clean with dependencies so if I would do a npm update, it wouldn’t break everything (already tried in fact and in fact I am re-starting from scratch again)
Maybe I could have missed something even it’s just a fresh starting app to implement… any direction would be appreciate… thanks a lot to all!!

Cheers!!! :slight_smile:

This sounds suspiciously like npm 7. If so, try downgrading to npm 6 (and the latest LTS Node version) and see if your problem persists.

Hello rapropos,

I deleted that myapp directory , then I downgraded npm to 6.14.13 (the latest of 6) , then I tried again to create a new app , typing:

ionic start areahotspot tabs --capacitor

found 35 moderate severity vulnerabilities
  run `npm audit fix` to fix them, or `npm audit` for details

Once finished so I did:

C:\Users\....\myapp>npm audit fix
npm WARN ajv-keywords@3.5.2 requires a peer of ajv@^6.9.1 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@2.3.2 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.3.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules\webpack-dev-server\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

up to date in 6.577s

129 packages are looking for funding
  run `npm fund` for details

fixed 0 of 35 vulnerabilities in 1617 scanned packages
  35 vulnerabilities required manual review and could not be updated

it looks like no more vulnerabilities for now but I’ll can’t update those packages I think… shall I try to update npm when I’ll have to compile the app with ionic serve? …

In the meanwhile , thank you!
Cheers!

My current position on this is that I’m not going to install npm 7 until @mhartington says it’s OK.

OK then I’ll keep npm on 6.13.14 for now. Let me know when it’ll be ok so I’ll update… thank you again for your support, rapropos ! :slight_smile:

Cheers!

Hello rapropos, I am actually using npm 6.13.14, and now it’s ok… next step is to try again with ionic cordova to see if it’ll be ok too. Let me know when those dependencies I said will be ok with npm ^7.x
Thank you again !!! :slight_smile:

Cheers !!! :slight_smile: