Viewing Generated Global CSS For Angular SASS Projects

Scenario

We wish to see what CSS is generated for styles.scss .

Approach

When opening an element in Chrome Developer Tools, by default it will show the SCSS source map, and not styles.css . However styles.css is right next to the tab containing the SCSS .

By turning off CSS source maps in Chrome Developer Tools we also will no longer get the styles.scssfile shown.

Go to Preferences and under the Sources column switch off Enable CSS Source Maps. However as noted this is really not necessary.

Demo

If we use a web container on Stackblitz it will serve styles.css.

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Ole Ersoy

Ole Ersoy

Founder of Firefly Semantics Corporation