根据项目需要可能会出连载

项目需要现在用gulp进行js的质量检测、合并、压缩、发布,未来需要进行sass的编译、合并、压缩,html、img的压缩以及md5戳、reload等功能,暂时先测试js的质量检测、合并、压缩、发布功能。

进行本操作时,默认你已经安装好NODE+RUBY+SASS+COMPASS+GULP

步骤一:npm init 新建package.json ,其内容格式如范本

{
"name": "testGulp",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node ./bin/www"
},
"dependencies": {
"express": "~4.12.0",
"serve-favicon": "~2.2.0",
"morgan": "~1.5.0",
"cookie-parser": "~1.3.5",
"body-parser": "~1.12.0",
"debug": "~2.1.0",
"i18n": "^0.5.0",
"swig": "~1.4.2",
"request": "^2.53.0",
"avoscloud-sdk": "^0.5.0",
"multer": "^0.1.8",
"qs": "^3.1.0",
"pagination": "^0.4.3",
"pagination-api": "^0.1.3",
"cookie-session": "^1.1.0",
"formidable": "^1.0.17",
"fs": "^0.0.2"
},
"devDependencies": {
"babel-cli": "^6.5.1",
"babel-core": "^6.6.4",
"babel-preset-es2015": "^6.6.0",
"gulp": "~3.9.0",
"gulp-clean": "^0.3.1",
"gulp-compass": "^2.1.0",
"gulp-concat": "^2.6.0",
"gulp-eslint": "^0.13.0",
"gulp-livereload": "^3.8.1",
"gulp-minify-css": "^1.1.5",
"gulp-nodemon": "^2.0.4",
"gulp-rename": "^1.2.2",
"gulp-rev": "^4.0.0",
"gulp-rimraf": "^0.1.1",
"gulp-ruby-sass": "^1.0.5",
"gulp-uglify": "^1.2.0",
"tiny-lr": "^0.1.5",
"gulp-notify": "^2.2.0"
}
}

步骤二:新建gulpfile.js 其内容格式如范本

var gulp = require('gulp'),
livereload = require('gulp-livereload'),
sass = require('gulp-ruby-sass'),
fs= require('fs');
var uglify = require('gulp-uglify'),
concat2 = require('gulp-concat');
rename = require('gulp-rename'); gulp.task('sass', function () {
return sass('./public/sass/')
.pipe(gulp.dest('./public/css'))
.pipe(livereload());
});
gulp.task('greet', function () {
console.log('Hello world! Never Bug!');
});

gulp.task('commoncss', function() {
     return gulp.src(['./public/sass/header.scss','./public/sass/footer.scss'])
     .pipe(concat2('main.scss'))
     .pipe(rename('common.min.css'))
     .pipe(gulp.dest('assets/css/'));
  });  

gulp.task('default', [
    'sass',
    'watch'
  ]);

步骤三:如gulp任务commoncss cmd里输入gulp commoncss 在目标生成的文件夹里可以看到我们合并的文件

gulp ---攻略一的更多相关文章

  1. 【C#代码实战】群蚁算法理论与实践全攻略——旅行商等路径优化问题的新方法

    若干年前读研的时候,学院有一个教授,专门做群蚁算法的,很厉害,偶尔了解了一点点.感觉也是生物智能的一个体现,和遗传算法.神经网络有异曲同工之妙.只不过当时没有实际需求学习,所以没去研究.最近有一个这样 ...

  2. 微软MVP攻略 (如何成为MVP?一个SQL Server MVP的经验之谈)

    一.本文所涉及的内容(Contents) 本文所涉及的内容(Contents) 初衷 什么是微软MVP? 成为微软MVP的条件? 如何成为微软MVP? (一) 申请时间划分 (二) 前期准备 (三) ...

  3. Windows下LATEX排版论文攻略—CTeX、JabRef使用介绍

    Windows下LATEX排版论文攻略—CTeX.JabRef使用介绍 一.工具介绍 TeX是一个很好排版工具,在学术界十分流行,特别是数学.物理学和计算机科学界. CTeX是TeX中的一个版本,指的 ...

  4. linux下安装apache与php;Apache+PHP+MySQL配置攻略

    1.apache   在如下页面下载apache的for Linux 的源码包    http://www.apache.org/dist/httpd/;   存至/home/xx目录,xx是自建文件 ...

  5. 生成 PDF 全攻略【2】在已有PDF上添加内容

    项目在变,需求在变,不变的永远是敲击键盘的程序员..... PDF 生成后,有时候需要在PDF上面添加一些其他的内容,比如文字,图片.... 经历几次失败的尝试,终于获取到了正确的代码书写方式. 在此 ...

  6. Java数组技巧攻略

      Java数组技巧攻略 0.  声明一个数组(Declare an array) String[] aArray = new String[5]; String[] bArray = {" ...

  7. BZOJ3252: 攻略

    Description 题目简述:树版[k取方格数]   众所周知,桂木桂马是攻略之神,开启攻略之神模式后,他可以同时攻略k部游戏. 今天他得到了一款新游戏<XX半岛>,这款游戏有n个场景 ...

  8. [经验] Win7减肥攻略(删文件不删功能、简化优化系统不简优化性能)

    [经验] Win7减肥攻略(删文件不删功能.简化优化系统不简优化性能) ☆心梦无痕☆ 发表于 2014-1-24 11:15:04 https://www.itsk.com/thread-316471 ...

  9. 从小工到专家 ——读《Java程序员职场全攻略》有感

    从小工到专家 ——读<Java程序员职场全攻略>有感   <Java程序员职场全攻略>是以故事的形式,向读者介绍Java程序员的职场经验.作者牛开复在北京从事软件开发,已经是一 ...

随机推荐

  1. Editplus配置VC++(1) 及相关注意事项

    下篇文章:Editplus配置VC++(2) 与/d1reportSingleClassLayout 原本用的是VC++2010 现在换成了Visual Studio 2013,editplus相关配 ...

  2. 如何使用VS2013对C++进行编程

    https://msdn.microsoft.com/zh-cn/library/bb384842.aspx

  3. winform开发框架之模块维护

    前言:模块维护试图解决的问题, 模块加载只用MEF的方式: MEF(Managed Extensibility Framework)是一个用于创建可扩展的轻型应用程序的库. 应用程序开发人员可利用该库 ...

  4. parseInt的源码阅读

    parseInt的源码阅读 Integer.parseInt()这个方法的功能小巧又实用,实现起来困难不大,没有很复杂.这里就来看一下Java的源码是怎么写的吧,走一边大婶写过的代码,应该会有点收获吧 ...

  5. iOS - Mac Vim 编辑器

    Mac Vim 编辑器 1)vi 文本编辑器 1.打开一个文件:vi 文件名 按住 shift 连按两次 z 键( :q )退出 vi 编辑器 2.vi 两种模式:第一是命令模式(按 esc 进入命令 ...

  6. 程序设计入门——C语言 第4周编程练习 2 念整数(5分)

    题目内容: 你的程序要读入一个整数,范围是[-100000,100000].然后,用汉语拼音将这个整数的每一位输出出来. 如输入1234,则输出: yi er san si 注意,每个字的拼音之间有一 ...

  7. json化 datatable

    /// <summary> /// 将DataSet中数据,json化 /// </summary> /// <param name="source" ...

  8. centos6.5安装sublime text 2

    今天在看ueillemmx的博客的时候,看到一神级编辑器,随即安装试了试,我了个去,果然好用,自动补全,自动对齐,样样精通啊! 下面是根据ueillemmx的步骤在CentOS上安装Sublime的过 ...

  9. 如何禁用IE10的明文显示密码和快速清除功能

    IE10针对 <input>及<input type="password"> 分别提供了快速清除钮(X图标)以及密码文字显示钮(小眼睛图标)的功能: 快速清 ...

  10. CentOS 6.x 一键安装PPTP VPN脚本

    环境 CentOS 6.x 32位/64位XEN/KVM/OpenVZ 步骤 依次运行下列命令 #wget http://www.hi-vps.com/shell/vpn_centos6.sh #ch ...