postcss-angular

A PostCSS syntax for angular components using inline styles. Includes a stringifier and a parser.

Getting Started

Install postcss-angular as a dev dependency:

npm install -D postcss-angular

or

yarn add -D postcss-angular

Usage with Stylelint

Add an override for postcss-angular to your .stylelintrc.json:

{
  "extends": "stylelint-config-standard",
  "overrides": [
    {
      "files": ["**/*.component.ts"],
      "customSyntax": "postcss-angular"
    }
  ]
}

vscode-stylelint

To make postcss-angular work with stylelint in VSCode, you need to enable TypeScript validation in your settings.json:

"stylelint.validate": ["scss", "typescript"]

You can use vscode-stylelint to display errors and to fix auto-fixable problems.

Logging

By default, postcss-angular does not create any log files. If you need to enable logging for debugging purposes, set the POSTCSS_ANGULAR_LOGGING environment variable to true:

POSTCSS_ANGULAR_LOGGING=true stylelint "**/*.component.ts"

When enabled, logs will be written to .postcss-angular/logs in the current directory.