csslint在前端项目中的使用

大家都听说过jslint，eslint，不过你可能没见过csslint，你可能会问csslint有什么用，为什么今天要说csslint，是因为我在开发中遇到一个坑，其实之前不怎么使用csslint的，既然踩到坑了，就要解决。

是这么回事，我在写css的时候不小心在括号后面多写了一个分号，可能是习惯问题，以为在写js，就带上了一个分号，在我手机上（安卓6.0）运行没问题，结果老板说在他手机（安卓4.4）有问题，就是一个动画没有效果，我一开始想，我用了css3的新属性做动画，会不会是兼容性问题，我在Can i use查过transform,animation的兼容性，发现4.4是支持css3动画属性的。怎么想都不知道问题出在哪。我又不想用js去做动画，毕竟影响性能。没办法，找不到问题所在，于是我打算用js去做动画。正准备写js的时候，突然看到css代码多了分号，我去掉后结果就好了。

问题虽然解决了，我就在思考，如果后期开发中还会遇到这样的问题怎么办。于是我就想起来之前看到过csslint的文章，我去csslint官网检查了一下我的css代码，果然有问题。由于我的手机版本比较高，可能自动修复了错误。低版本的可能就报错了。

如果你的项目采用模块化，npm上面有csslint的插件，使用webpack打包工具可以整合csslint。如果不是模块化，你可以到csslint官网，直接把你的css代码粘贴，然后进行验证。csslint可以配置验证规则，你可以根据自己的需求进行配置。

所以以后开发尽量使用csslint去检查一下css代码的正确性。

 

 

转载于:https://www.cnblogs.com/zt123123/p/7597584.html