grunt 配置

1、首先电脑上面安装node

nodejs官网：https://nodejs.org/en/

image.png

2、安装grunt的命令环境：npm install grunt-cli -g 全局安装需要 加-g

image.png

3、查看有没有安装成功，输入命令：grunt --version

image.png

4、手动在文件夹中创建 Gruntfile.js 文件

image.png

4、输入命令 npm init 生成 package.json文件（这里我是一路Enter 到底 ）

image.png

image.png

5、安装grunt 输入命令：npm install grunt --save-dev

image.png

image.png

这个时候自动加上了grunt 版本号，这也就是命令 --save-dev 的作用

6、安装grunt插件了

js语法检查:grunt-contrib-jshint

css语法检查：grunt-contrib-csslint

合并文件：grunt-contrib-concat

js压缩文件：grunt-contrib-uglify

css压缩文件：grunt-contrib-cssmin

image压缩文件：grunt-contrib-imagemin

html压缩文件：grunt-contrib-htmlmin

Sass\Scss 编译：grunt-contrib-sass

Less 编译：grunt-contrib-less

监听文件变动：grunt-contrib-watch

建立本地服务器：grunt-contrib-connect

输入命令：npm install grunt-contrib-jshint --save-dev 直接下载对应的插件，一个一个下载是不是太麻烦了？这里也可以直接输入所有的插件名，然后一起下载
npm install grunt-contrib-jshint grunt-contrib-csslint grunt-contrib-concat grunt-contrib-uglify grunt-contrib-cssmin grunt-contrib-imagemin grunt-contrib-htmlmin grunt-contrib-sass grunt-contrib-less grunt-contrib-watch grunt-contrib-connect --save-dev下载好后，看下package.json文件里面变化

image.png

7、配置Gruntfile.js