8

I have an Angular project that uses Angular+Sass, and since the project became pretty big I am constantly finding unused small css classes that need to be removed. I am trying to find a way to remove them all, but for now nothing helped me.

I tried purifycss that didn't give me any output or error, ngx-unused-css that I cannot make it work since it has a framework error (path must be string not undefined), and I feel like I am out of options, and the coverage of Chrome that doesn't display any css files in it, and external sites are not an option since they won't have access to the deployed project location.

Is there some kind of tool or option that I can use to find all unused classes in Angular/Sass?

Artyomska
  • 1,309
  • 5
  • 26
  • 53
  • Does this answer your question? [Can angular-cli remove unused css?](https://stackoverflow.com/questions/40330938/can-angular-cli-remove-unused-css) – nitishk72 Nov 15 '19 at 13:39
  • 1
    Doesn't this do everything in an already built version? I am searching for some tool that can scan my files before any building and give me some info a la coverage what is used and unused, so I can delete those classes myself (or the tool can delete them) I am trying to eliminate the css directly from the code before any minification is done. – Artyomska Nov 15 '19 at 13:45

2 Answers2

15

There are a lot of IDE plugins for that.

On my case I use https://marketplace.visualstudio.com/items?itemName=rcore.rcore-unused-css-classes from Visual Studio Code Extensions

Pedro Bezanilla
  • 1,167
  • 14
  • 22
  • 3
    This worked very well, even if it wasn't automated and you need to be careful at what you remove since it doesn't find ngClass or general.scss classes as valid. But it did the job and now my css is clean. Thank you. – Artyomska Nov 22 '19 at 14:01
0

Please try to use PurgeCSS to find out unused CSS in Angular project

PurceCSS is a well-known tool that scans the output of the built CSS files and will use it's heuristics and extractors to remove unused CSS - predominantly brought to fame thanks to Tailwind.

Refer below link for your reference.

https://dev.to/dylanvdmerwe/reduce-angular-style-size-using-purgecss-to-remove-unused-styles-3b2k

Yogesh Sonar
  • 11
  • 4