PostCSS?PostCSS常用插件?

PostCSS?

指将css文件通过post方式转换为另一个css文件。

PostCSS本身是一个功能比较单一的工具,它提供了一种方式用JavaScript代码来处理CSS。利用postCSS可以实现一些工程化的操作,如:自动添加浏览器前缀,代码合并,代码压缩等。(这里我们在进行一个工程化的处理叫做postCSS,webpack也是用于进行工程化的处理打包等)

官方网址:https://postcss.org/

安装:

1.安装node环境   然后命令行窗口输入node -v查看node是否安装成功,成功的话会输入node的版本号

2.然后在命令行窗口输入nmp  install  postcss-cli  -g以安装postcss-cli

3.-o (用于将css工程化,如 postcss  src/demo.css  -o  dist/demo.css )、

  -w(事件监听,指转换前的css通过保存后,转换后的 css也会跟着改变,而不用时时刻刻去命令行窗口通过-o来进行转换。在工  程化的后面加上 -w即可,要退出的话ctrl+c按两下即可退出)

4.postcss.config.js(配置文件,配置我们要使用的插件)

PostCSS常用插件?

autoprefixer:(指给浏览器自动添加前缀)

postcss-import:(将CSS进行合并操作)

cssnano:(对CSS进行代码压缩处理)    cnpm  i  插件名  

postcss-cssnext:(处理比较高级的CSS代码,即把CSS降级以适用低浏览器)

stylelint:(语法检测插件)

postcss-sprites:(自动生成精灵图即雪碧图)

....

引入插件方式: const  变量名= require( ‘插件名’);

 

发布了111 篇原创文章 · 获赞 0 · 访问量 1019

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 1024 设计师: 上身试试

分享到微信朋友圈

×

扫一扫,手机浏览