Angular support postcss?

[jon9090]

Which @angular/* package(s) are relevant/related to the feature request?

core

Description

Does angular support postcss? can I configure to run postcss to my .scss files and styles from the components (css in js)?

And regards to css-in-js (styles inside the component), why angular does not extract css into separate css file?

Proposed solution

n/a

Alternatives considered

n/a

[alan-agius4]

Angular CLI does use postcss on stylesheets and it comes out of the box which doesn't require any configuration other than configuring the browsers that you'd like to support in the browserslist configuration RC file.

Regarding CSS-in-JS for components, this is expected and is design choice. One of the reasons for this is to allow view encapsulation since CSS will be emitted with placeholders which will be changed during runtime.

CSS in JS

styles: ["a[_ngcontent-%COMP%]{color:#fff}"],

Appended css in head

<style>a[_ngcontent-ubh-c16]{color:#fff}</style>

[lycHub]

It is useless to create a new postcss.config.js in the root directory. Can you directly configure postcss plugins such as postcss-nesting without using tools such as custom-webpack?

[alan-agius4]

It is useless to create a new postcss.config.js in the root directory. Can you directly configure postcss plugins such as postcss-nesting without using tools such as custom-webpack?

No, Angular CLI itself does not allow configuration of postcss plugins. The fact that Angular is using postcss is an implementation detail.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}