一個 Node.js 的 CSS 后處理器框架：PostCSS
PostCSS 是一個 Node.js 的 CSS 后處理器框架，與 Sass/Less 相比，它完全使用 JS 控制邏輯，讓 CSS 開發者可以更專注于 CSS 編寫，同時還有完整的 source map 支持等特性。可以用來做 CSS 預處理、壓縮/美化、編輯器插件、CSS polyfill、命令行工具等。
利用 PostCSS構建：
Tools
- Autoprefixer adds vendor prefixes by Can I Use data.
- BEM linter lints CSS for SUIT CSS methodology.
- CSS MQPacker joins same media queries.
- css2modernizr analyzes your CSS and output only used Modernizr’s settings.
- cssnext is a transpiler (CSS4+ to CSS3) that allow you to use tomorrow’s CSS syntax today.
- CSSWring is a CSS minifier with full source map support.
- data-separator splits data-uri into a separate CSS file.
- pixrem is aremunit polyfill.
- webpcss to duplicate images in CSS to WebP for supported browsers.
- Pleeease is a pack of various postprocessors.
- Pleeease Filters converts WebKit filters to SVG filter for other browsers.
- RTLCSS mirrors styles for right-to-left locales.
- CSS Byebye explicitly removes the CSS rules that you don’t want.
- postcss-epub to prefix ePub3 properties.
- doiuse to lint your CSS on unsupported properties by Can I Use.
- postcss-assets to inline files and insert image width and height.
- ACSS Annotations based CSS processor. </ul>
- postcss-calc to reducecalc()usage (recommended withpostcss-custom-properties).
- postcss-color-function to transformcolor()function.
- postcss-color-gray to transformgray()function.
- postcss-color-hex-alpha to transform hexadecimal notations with alpha (#rrggbbaaor#rgba).
- postcss-color-hwb to transformhwb()function.
- postcss-color-rebeccapurple to transformrebeccapurplecolor.
- postcss-import to transform@importrules by inlining content.
- postcss-custom-media to add names for Media Queries.
- postcss-custom-properties to transform Custom Properties for cascading variables.
- postcss-url to rebase or inline onurl().
- postcss-font-variant to setfont-feature-settingsby readable properties.
- postcss-nested to unwrap rules in other rules, like you can write in Sass.
- postcss-custom-selector to add custom alias for selectors.
- postcss-media-minmax to use<=or>=in CSS Media Queries.
- postcss-data-packer to move an embedded data into a separate file.
- postcss-color-palette to transform CSS2 color keywords to a custom palette.
- postcss-color-hex to transform rgb() and rgba() to hex. </ul>
Plugins
本文由用戶 nf456 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。
轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。
本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！