月薪过万必备：开发 CSS 最好的前端工具推荐！

把你的注意力从方法和技术的洪流中移开一会，你就可能会错过什么！上周我遇到我的一个前端开发朋友，他很兴奋地跟我谈论他使用的一些新工具。其中最有意思的是使用 Grunt 来编译 SCSS。人们很容易忘记不是每个人都和你走在同一条路上。他们或是有使用限制，或是视野狭窄，无法洞悉周遭的环境。我使用 Grunt 和使用 SCSS 一样久。听他讲起他不得不通过命令行可以手动触发编译之后，我很是痛苦。所以我想分享一些我经常使用的前端开发工具（尤其是CSS）和极为重要的前端开发工具。1、文件查看和编译首先，如果你还在使用命令行编译SASS，那肯定得看自动执行的过程，这里有许多你用得上的工具，我使用 Grunt-Watch，但是有很多人喜欢 Gulp-Watch。 一些 IDE 内建预处理器，可以看看到底哪个适合你。2、CSS库库是一个大型工具包，它包含并混合从 CSS 重置、跨浏览器背景渐变和使用黄金比例设置字体大小的便捷数学计算等的很多东西。主流的库：BourbonCompassPostCSS 我使用 Compass 好几年了，这是一个很棒的工具集。但是我发现它能做的远超我的实际需要 。我用在 Compass 上学到的知识创建了一个轻量级的自定义栈插件，它使得 scss 编译时间从4秒降低到几乎为零。3、Autoprefixer不必担心浏览器前缀问题了！ Autoprefixer 基于 https://caniuse.com 添加所需的前缀。当我单枪匹马干活时，给我节省了不少时间，强烈推荐。4、Animate.css我喜欢编写我自己的 CSS 动画效果，但经常我们没有太多的时间。 Animate.css 可以让我快速的添加和测试 CSS 动画效果，无需思考这些动画的逻辑。5、KSS styleguideKSS 允许你从你的CSS直接创建一个样式向导文件，这有很多的优点。配对的 KSS含有一个模块化的CSS，比如BEM，允许你可靠的创建一个可重复使用的可见样式集，你会从强大的文档中获得巨大的回报。 KSS Styleguide is one of my favorite front end development tools你通过文档化的CSS得到正强化。由于文档和可视化的样式向导，组件更容易被找到和重用-不用怀疑，如果已经建立了一个类似的组件！6、CSS minification with CSS NANO自动缩小我编写的CSS文件。 Minification for front end developmentCSSNANO 也可以删除所有不必要的或过时的浏览器前缀，如果有的话，以及重复的类。我目前是在职前端开发，如果你现在也想学习前端开发技术， 在入门学习前端的过程当中有遇见任何关于学习方法，学习路线，学习效率等方面的问题， 你都可以申请加入我的前端学习交流裙：前面：603 中间：985 最后：993。里面聚集了一些正在自学前端的初学者 裙文件里面也有我做前端技术这段时间整理的一些前端学习手册，前端面试题， 前端开发工具，PDF文档书籍教程，需要的话都可以自行来获取下载。

本文章由javascript技术分享原创和收集