Gulp实战

推荐文章：

gulp.js中文网   :     http://www.gulpjs.com.cn/

DBPOO           ：   http://www.dbpoo.com/getting-started-with-gulp/

Ooo_My_God   ：   http://www.ydcss.com/archives/424

w3cplus          ：    http://www.w3cplus.com/blog/tags/511.html 

 

demo截图:

讲一下目录结构：

c\ 文件夹为发布css文件夹(css简写);

i\ 文件夹为发布img文件夹(img简写);

j\ 文件夹为发布js文件夹(js简写);

src\ 生产环境下的文件

config.js 为gulp里路径配置的文件(可不写)

gulpfile.js 为gulp配置文件

package.json node安装配置文件

总文件夹：

生产文件夹：

 

package.json:

 1 {
 2   "name": "test-gulp2",
 3   "version": "1.0.0",
 4   "description": "",
 5   "main": "index.js",
 6   "scripts": {
 7     "test": "echo \"Error: no test specified\" && exit 1"
 8   },
 9   "author": "uuu",
10   "license": "ISC",
11   "devDependencies": {
12     "gulp": "^3.9.1",
13     "gulp-autoprefixer": "^3.1.0",
14     "gulp-concat": "^2.6.0",
15     "gulp-connect": "^3.2.1",
16     "gulp-htmlmin": "^1.3.0",
17     "gulp-imagemin": "^2.4.0",
18     "gulp-jshint": "^2.0.0",
19     "gulp-livereload": "^3.8.1",
20     "gulp-minify-css": "^1.2.4",
21     "gulp-notify": "^2.2.0",
22     "gulp-rename": "^1.2.2",
23     "gulp-rev-append": "^0.1.6",
24     "gulp-sass": "^2.2.0",
25     "gulp-uglify": "^1.5.3",
26     "imagemin-pngquant": "^4.2.2"
27   }
28 }

View Code