PostCSS HTML Syntax
PostCSS syntax for parsing HTML (and HTML-like)
Getting Started
First thing's first, install the module:
npm install postcss-syntax postcss-html --save-dev
If you want support SCSS/SASS/LESS/SugarSS syntax, you need to install the corresponding module.
- SCSS: postcss-scss
- SASS: postcss-sass
- LESS: postcss-less
- SugarSS: sugarss
Use Cases
const postcss = ;const syntax = // syntax for parse scss (non-required options) scss: // syntax for parse less (non-required options) less: // syntax for parse css blocks (non-required options) css: ;;
If you want support SCSS/SASS/LESS/SugarSS syntax, you need to install these module:
- SCSS: postcss-scss
- SASS: postcss-sass
- LESS: postcss-less
- SugarSS: sugarss
Advanced Use Cases
See: postcss-syntax
Turning PostCSS off from within your HTML
PostCSS can be temporarily turned off by using special comments in your HTML. For example:
<!-- postcss-disable --><!-- postcss-enable -->
Style Transformations
The main use case of this plugin is to apply PostCSS transformations to <style>
tags and <div style="*">
property in HTML (and HTML-like).