Angular v19 and Sass Deprecation Warnings – What’s Going On?

If you’re upgrading your Angular project to the release candidate of Angular v19 using the CLI, you might run into a flood of Sass deprecation warnings during build or serve.

You’ll probably see messages like:

[WARNING] Deprecation [plugin angular-sass]

_variables.scss:79:29:
  LN │ $dark-color: darken($color, 10%) !default;
     ╵              ^

darken() is deprecated. Suggestions:
color.scale($color, $lightness: -17.05%)
color.adjust($color, $lightness: -10%)

These warnings are triggered by deprecated Sass functions like darken() and stem from updates in the Sass compiler used under the hood by Angular.

What Changed in Angular v19?

After digging around, I discovered that this behavior is due to Angular upgrading the Sass compiler dependency from version 1.77.6 to 1.80.6. The new version enforces stricter warnings for deprecated syntax.

Luckily, thanks to a recent change introduced by Alan Agius, there’s already a way to suppress these warnings using a new Sass compiler config.


How to Silence Sass Warnings in Angular v19

To get rid of these noisy deprecation warnings (temporarily), you can configure your project’s build options in angular.json (or project.json for Nx setups) like this:

"architect": {
  "build": {
    "options": {
      "stylePreprocessorOptions": {
        "sass": {
          "silenceDeprecations": [
            "mixed-decls",
            "color-functions",
            "global-builtin",
            "import"
          ]
        }
      }
    }
  }
}

This will suppress the deprecation warnings introduced in the latest Sass update — giving you some breathing room without changing your styles immediately.

Final Thoughts

While silencing these warnings is a helpful short-term fix, it’s worth planning to refactor your Sass in the near future. Sass has been evolving, and relying on deprecated features like darken() won’t be sustainable in the long run. If you’re aiming for future-proof styles, start transitioning to the recommended color.scale or color.adjust functions.

Let me know if you’d like help converting legacy Sass to modern syntax!

Leave a Comment

Your email address will not be published. Required fields are marked *