前端工程师都有用哪些比较靠谱的小工具？
发布网友
发布时间：2022-04-22 06:54
共1个回答
热心网友
时间：2022-06-17 00:24
1. node.js + npm， 这个是前端工具的一个平台，没有他们就没有以下的工具，建立开发环境，下载开发工具，运行开发工具的利器
2. bower, 库依赖管理器，类似于npm，但针对浏览器JavaScript的依赖管理，减少寻找库，下载库和升级库的烦恼
3.grunt，流程自动化管理工具，将你非编程的开发步骤减到最小，grunt watch+liveReload或者grunt connect,可以使得免除你F5无尽地狱，发布和开发各种无压力。以下大部分开发工具，都有grunt的相对应的插件，也就是说他们都能利用grunt进行自动化运行
5. 本人用less比较多，因为基本无缝兼容历史遗留系统中的css，（而Sass语法比较特殊，还没有专门用过，应该开发新系统的css比较好），一套css预编译语言，可以把less语法转成css语法，lessc是less语言编译器，配合grunt less，编写大型css文档毫无压力。
6.Phantomjs，没有界面的浏览器，用js脚本控制其操作网页。测试，抓图，网页流程自动化利器。配合casperjs的语法简化功能真强库后，控制Phantomjs就更加容易了
7. grunt PhotoBox, 利用phantomjs抓图功能和ImageMagick图片比较功能，在利用live-reload即时刷新功能，可以让你开发css的时候，快速对n多个页面进行观察，看其前后变化。不过缺点也比较明显，就是速度慢。但比起手动对比来看，还是非常快的。值得css开发时拥有。
8. phantomCSS，这个和grunt photobox类似，都用于css开发的，差别是photobox是全局观察差别，而这个是单元组件观察差别，它方便你就抓页面中某一块元素然后进行前后比较，更加注重细节上的差异，这个比较合适组件开发时候使用。
9. jshint，帮助你快速定位JavaScript的语法错误和潜在的跨浏览器兼容性问题。在部署你JS前，用jshint检查一下是没错的 。
10.UglifyJS，压缩JavaScript代码，使你的JS代码可以更加快速的加载。有grunt的插件
11. browserify允许你在浏览器里面使用CMD标准模块，但本人认为它的另外一个优势是合并代码，开发时候可以把代码模块化，分成很多很多小文件，然后有调理的放到相对应文件夹下，然后最后合成单一文件。本人曾经利用browserify开发greasemonkey代码，大大简化了greasemonkey的开发难度和增强了greasemonkey代码的质量。browserify有grunt插件，这样又减少的开发步骤。
12. Karma， google开发的一个单元测试运行器，这个自己本身不是一个单元测试框架，而是配合测试单元框架的一个工具。由于前端浏览器众多，就算你有live-reload这样自动化工具，但是还是要手动打开各种浏览器，手动把你的单元测试在各个浏览器都运行一遍。这个工具目的是目的就是让电脑能自动化打开各种浏览器，然后把单元测试在各个浏览器中自动运行一遍，让这个步骤也能自动化了。
13.clean-css (grunt cssmin)， 我用的是grunt cssmin，但是grunt cssmin实际上背后使用的是clean-css工具，这个工具就是用来压缩精简css的，让css文件大小更小。
