How to update the angular version in custom cockpit

Detailed explanation of the problem:

I have cloned a custom cockpit application with this version 1015.0.249 and I got by default angular it’s dev dependencies version as 12.2.14

Eg:
@angular-devkit/build-angular": “12.2.14”
@angular/core": “12.2.14”

Now I am getting the Prototype pollution in webpack loader-utils in GitHub security and dependabot is asking me to update to loader-utils version as 2.0.3. and angular-devkit/build-angular to 15.2.7.

If I update the version of angular-devkit/build-angular to 15.2.7 I am getting run time errors other dependencies like angular compiler. How to fix this issue ? Can’t we update the angular version ?

Error messages / full error message screenshot / log file:

Prototype pollution in webpack loader-utils

Bumps loader-utils to 2.0.4 and updates ancestor dependency [@angular-devkit/build-angular]
(GitHub - angular/angular-cli: CLI tool for Angular). These dependencies need to be updated together.

Question related to a free trial, or to a production (customer) instance?

Cumulocity Production

Regards
Mohan

1 Like

Hi Mohan,

like with other libraries that are made for Angular, also the Cumulocity WebSDK is quite bound to a specific (major) Angular version, but you should at least be able to switch to newer minor or fix versions of Angular without any issues.

You can use npm’s overrides or yarn’s resolutions feature to manually override the version of e.g. loader-utils.

For newer Angular versions you should also switch to newer WebSDK versions. Version 1016 ships e.g. with Angular 14 which uses newer versions of loader-utils.

Regards,
Tristan

1 Like

I don’t want to update the Cumulocity WebSDK version, since we already developed a widgets on the current version(10.15.0.249). So I thought to update only the loader-utils version with out touching WebSDK and angular version.

For my use case only I have one option npm overrides ? can you help me with sample example should I use something like below in package.json file ?

{
  "overrides": {
    "loader-utils": "2.0.3"
  }
}

Regards
Mohan

Hi Mohan,

as you only want to override the version of loader-utils for @angular-devkit/build-angular, I would suggest something like:

{
  "overrides": {
    "@angular-devkit/build-angular@~12.2.14": {
      "loader-utils": "2.0.4"
    }
  }
}

If you have further packages that depend on loader-utils in version 2.x proceed in a similar way.
I’ve added the @~12.2.14 part so that in case you upgrade to a newer version (e.g. 14.x), this override would not apply.

Note that overrides are as far as I know only available in npm with version 8+.

Regards,
Tristan

1 Like

I have tried this approach but there is no version change in the lock-file for loader-utils

Regards
Mohan

Which version of npm do you use?

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.