我所熟悉的每一个开发者，都急切地盼望着在开发中使用上 LibSass。当 Eric 宣布 Susy 已经可以完美融入 LibSass 的时候，我激动的跳了起来，并开始思考使用 Grunt 来创建一个构建流程。本文中我将会向你演示，我是如何配置 Grunt 来整合 LibSass 和 Susy 的。

Grunt是一个任务管理器，能大大提高您运行前端开发工作流程。使用大量的Grunt插件可以自动执行任务，例如编译Sass和CoffeeScript，优化图像和验证您的JavaScript代码与JSHint。在过去你可能使用类似CodeKit或Hammer来处理这些任务。我认为这两种应用程序是伟大的(过去广泛的使用他们)，但Grunt比他们更优秀，他可以定制任务。有很多插件可以帮助你优化图片和在你的工作流中加入CSS样式。在这篇文章里你将学习如何设置Grunt和配置Compass & Sass，JSHint和CSS连接的任务。我们开始吧。

在《Grunt教程——初涉Grunt》和《Grunt教程——安装Grunt》中得知，Grunt项目中都是通过Gruntfile.js来配置任务。可以说，Gruntfile.js文件在任何一个Grunt项目中都是必不可少的，从这也可以看出这个文件的重要性。欲要搞清楚Grunt怎么工作，就必须要先了解Grunt是如何通过Gruntfile.js配置任务，帮助你实现你需要的功能。如果你还不知道Gruntfile.js是什么，建议您先阅读Grunt了解一下，如果你觉得这样麻烦，也不必过于担心，你也可以通过下面将要介绍的内容，深入的了解Gruntfile.js，并学习如何配置。

最近我一直在通过自动化任务完成在日常生活中的工作流。我也想在跨团队开发中有一套实现项目的标准化，设置一个项目结构和确保必要的正确无误的任务。CodeKit对于我来说已经很好了，但很多地方仍然有一些问题；能够更多的实现跨平台自动化而不需要为不同的应用程序配置不同的项目结构。他被叫作Grunt。这一篇关于Grunt的基础教程，而且这样的教程在站上也有多篇，我一直在重复的做这样的一件事情，想通过不同的优秀文章，实例来加深对Grunt的理解与实战。今天根据markgdyr的《Automating your workflow with Grunt》所译，和大家一起学习如何使用Grunt实现自动化工作流，减少你每天重复多次而又乏味的任务。

在上一节《Grunt教程——初涉Grunt》一文中介绍了Grunt是什么，今天我们主要一起来学习和探讨Grunt如何安装。俗话说，巧妇难为无米之炊，要想正常的使用Grunt，首要条件你要在自己的电脑环境中具备运行Grunt的环境。别的先不说了，我们切入正题。Grunt和Grunt插件应该作为项目依赖定义在你项目的package.json中。这样就允许你使用一个单独的命令:安装你项目中的所有依赖（在中定义好的Grunt和Grunt插件在使用时会自动安装相关依赖，正如我们已经了解到的，这些依赖定义在中了）。当前稳定的和开发中的Grunt版本始终都列在wiki页面上。

在平常的工作之中，我们都不断的在重复着做相同的事情，比如说将Sass编译成CSS，检测JavaScript语法，压缩CSS、JavaScript。特别在团队合作开发中，常常会为了各自的习惯而不断的发生麻烦，给开发带来极大的不便。而且前端开发人员在周而复始的做这些相同的，乏味的事情。很多时候我们想工作变得更有意义，更能专注于开发，就希望有一种工具能让我们不去做这些重复而乏味的工作。这就有了Grunt，而这个Grunt让我们编码变得更意义，更开心。

前端自动化，这样的一个名词听起来非常的有吸引力，向往力。当今时代，前端工程师需要维护的代码变得及为庞大和复杂，代码维护、打包、发布等流程也变得极为繁琐，同时浪费的时间和精力也越来越多，当然人为的错误也随着流程的增加而增加了更多的出错率。致使每一个团队都希望有一种工具，能帮助整个团队在开发中能精简流程、提高效率、减少错误率。随之讨论自动化部署也越来越多，并且国内很多大型团队也都有自己成熟的自动化部署工具。据我所知，百度有FIS,腾讯有Modjs，360有燕尾服，还有很多团队在使用Ant，Shell等，而现在讨论较多的是Grunt。出于对这方面的兴趣爱好，我也开始加入Grunt的使用大军，也开始在学习并尝试使用Grunt。那么从今天开始，我和大家将一起学习和使用Grunt。

在本文中，我们将探讨如何使用Grunt在项目和你的网站更快。我们将简要的分析一下Grunt可以做什么，如何设置和使用各种插件来做举世瞩目的项目。我们将看看如何构建一个简单的表单验证器，使用Sass预处理器，如何使用和CssMin结合压缩我们的CSS，如何使用HTMLHint确保我们的HTML书写正确，如何在构建我们的压缩资产，也会看看使用UglifyJS减小我们JavaScript的大小和确保我们的网站使用尽可能的少的带宽。

Grunt是JavaScript创建的任务管理器。这意味着它将帮助你自动化运行任务，比手工运行任务节约更多时间。而且讨论和使用的人越来越多，做为前端的人员，我们很有必要学习和掌握Grunt的使用。因此我也脱不了这个俗，加入学习Grunt的阵营。今天根据Mark McDonnell的《Grunt Boilerplate》所译，以Grunt Boilerplate项目为例，向大家介绍了如何使用Grunt构建常用的任务管理器。如果你也感兴趣，那就继续往下阅读吧。

Grunt是构建Web开发的一个系统，但它创建比较困难。在这个指南中，你将学会如何配置Grunt创建一个现代的Web项目。当你完成教程中的配置之后，你的Gruntfile将具有：从源目录中向目标目录复制文件；删除构建文件；编译文件和给他们添加前缀；编译；压缩和文件；编译；当文件修改后自动构建源文件；运行开发者服务器 等。接下来的内容根据Landon Schropp的《Writing an Awesome Build Script with Grunt》所译，与大家一起学习Grunt如何构建一个Web开发系统，希望大家喜欢。