Nodejs是服务端的，用于并发处理事件。
Grunt是应用程序构建，任务管理工具，能够自动化地许多繁琐的工作。
sass是css语言的一种拓展，用于更高效更规范写出css。
环境：node与ruby
grunt的使用需要安装grunt与nodejs环境，而sass的使用需要安装sass和ruby环境。
现在安装好node.js后，可在cmd中输入node -v查看是否安装成功，若成功则会显示版本号。
安装好后，在cmd中输入npm update -g npm，该命令执行后将会把npm配置到系统路径中。可用npm -v来查看是否成功
接着输入 npm install -g grunt-cli（cli是command line interface），将grunt命令配置到系统路径中。
之后再项目的根目录下创建好package.json和Gruntfile.js两个文件
package.json：该文件用来储存一下项目相关的信息，以及grunt的使用所需要以来的库。
Gruntfile.js：该文件是用来配置和定义任务的，这些任务中的一部分依赖于package.json中grunt插件。
由于本文章主要讲述的是sass的自动编译的实现，故package.json和Gruntfile.js也是以此为例的。（在配置好这两文件后使用npm install，便可在项目中安装相应的插件）
此为package.json的内容：
{
"name": "gruntSass",
"version": "0.0.1",
"devDependencies": {
"grunt": "0.4.5",
"grunt-contrib-watch": "*",
"grunt-contrib-sass": "*"
}
}
在cmd中使用 npm install <模块名> --save-dev便可在其依赖库中加入相应的模块了。
此为Gruntfile.js的内容：module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
//Read the package.json (optional)
pkg: grunt.file.readJSON('package.json'),
// Metadata.
meta: {
basePath: '../',
srcPath: '../assets/sass/',
deployPath: '../assets/css/'
},
banner: '/*! <%= pkg.name %> - v<%= pkg.version %> - ' +
'<%= grunt.template.today("yyyy-mm-dd") %>\n' +
'* Copyright (c) <%= grunt.template.today("yyyy") %> ',
// Task configuration.
sass: {
dist: {
files: {
'<%= meta.deployPath %>style.css': '<%= meta.srcPath %>style.scss'
},
options: { // Target options
style: 'expanded'
}
}
},
watch: {
scripts: {
files: [
'<%= meta.srcPath %>/**/*.scss'
],
tasks: ['sass']
}
}
});
// These plugins provide necessary tasks.
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-watch');
// Default task.
grunt.registerTask('default', ['sass']);
};
Gruntfile.js是实现grunt工具的核心，这文件中包括了所有配置和索要执行的任务。
想要弄明白Gruntfile.js文件中的代码，我就要从头开始重新构建它：
module.exports = function（grunt）{
grunt.initConfig({
pkg:grunt.file.readJSON('package.json')
});
};
上述代码启动了配置的初始化函数，把package.json中的设置放到了缓存中，这样就可以在Gruntfile.js文件中的其他位置引用这些值了
接着是配置一个合并程序中脚本的任务：
module.exports = function（grunt）{
grunt.initConfig({
pkg:grunt.file.readJSON('package.json')，
concat：{
options：{
separetor:';'
},
dist:{
src:['src/**/*.js'],
dest:'dist/<%= pkg.name %>.js'
}
}
});
};
这段代码是让Grunt从src/目录中拉出。js文件，把他们合并后用在package.json中定义的名字保存于dist/目录下。
这代码是将 srcPath: '../assets/sass/'下的style。scss文件转译成css保存于 deployPath : '../assets/css/'目录下的，style：expended是表示转译输出文件的代码格式。sass: {
dist: {
files: {
'<%= meta.deployPath %>style.css': '<%= meta.srcPath %>style.scss'
},
options: { // Target options
style: 'expanded'
}
}
}