Search code examples
angularmarkdownangular12javascript-marked

Angular 12 Error ... from Css Minimizer Error: Transform failed with 1 error: error: Invalid version: "15.2-15.3"


I know this question has been asked before, but I seem to have a slightly different problem (at least, the solution provided in similar questions don't work for me).

The project is using Angular 12, there is (sadly) a required dependency that has not yet been able to update to Angular 13.

After updating the library ngx-markdown to v12.1.0, I had the error that node_modules/marked/lib/marked.js does not exist, so I changed the path in the angular.json script, as suggested on github.

Then, I got this error:

Error: Transform failed with 1 error: 
error: Invalid version: "15.2-15.3"

As suggested here, I updated @angular/cli to 12.2.16, but this did not solve the issue for me.

Next, I tried to delete the node_modules file, and the package-lock.json and reinstalled everything, this also did not work.

Then, I tried to delete the .browserslistrc file, and also adding to it ios_saf 15.2-15.3, both as suggested on this github thread, but neither worked.

Does anyone have an idea what I could try next? Otherwise I guess the best solution would be to revert to ngx-markdown v12.0.0 despite the vulnerability..


Solution

  • I managed to solve the error following these steps:

    1. Update script in angular.json "node_modules/marked/marked.min.js",
    2. Update angular/angular-devkit versions like this:
    "dependencies": {
        "@angular/animations": "12.2.0",
        "@angular/cdk": "12.2.0",
        "@angular/common": "12.2.0",
        "@angular/compiler": "12.2.0",
        "@angular/core": "12.2.0",
        "@angular/forms": "12.2.0",
        "@angular/platform-browser": "12.2.0",
        "@angular/platform-browser-dynamic": "12.2.0",
        "@angular/router": "12.2.0",
    // …
    },
    "devDependencies": {
        "@angular-devkit/build-angular": "12.2.16",
        "@angular-eslint/eslint-plugin": "12.3.1",
        "@angular-eslint/eslint-plugin-template": "12.3.1",
        "@angular-eslint/template-parser": "12.3.1",
        "@angular/cli": "12.2.16",
        "@angular/compiler-cli": "12.2.16",
        "@angular/language-service": "12.2.16",
    // …
    }
    
    1. Update ng-packagr to "12.2.7"

    Now it compiles without any issues. I also didn't need any changes to the browserlistrc file, which is the commonly suggested solution for the error.

    -> In case someone is wondering, my browserlistrc file looks like this:

    > 0.5%
    last 2 versions
    Firefox ESR
    not dead
    not IE 9-11 # For IE 9-11 support, remove 'not'.
    

    Kudos to github user fischeversenker for this comment: https://github.com/nrwl/nx/issues/8768#issuecomment-1050710663