LESS error after upgrading angular - operation on invalid type

I upgraded angular 9 to angular 18 (I know it's a big jump). I've fixed almost everything that went wrong during the update but I am not stuck at two recurring errors. I'll talk about only one here:

I have this error on only 4 (of probably 100+) less files:

./frontend/styles.less - Error: Module build failed (from ./node_modules/less-loader/dist/cjs.js):


li a {
padding-left: @padding-large-horizontal - @padding-small-vertical;
^
Operation on an invalid type
Error in D:\...\node_modules\...\dist\less\lists.less (line 131, column 6)



I've looked at this question and gone over the less options and have tried a few things, but nothing seems to fix it. To set the options, I have this in my index file:

<head>

<script>
// Configure less to always use maths
less = {
math: 'always' // have tried other options as well
}
</script>

</head>


Thing is, I'm not sure if that's the best place for it or if it is even being picked up. How do I test? If I am barking up the wrong tree, how do I fix this error please?

The error appears to be in a third party npm package so not much I can do, however, that lib is being used in pleny of places but only 4 of the stylesheets seems to trigger this error.

Continue reading...