zoukankan      html  css  js  c++  java
  • Gulp的简单使用

    我比较喜欢使用Gulp,因为简单好用!

    今天的任务是:使用Gulp来压缩 jQuery源码,各输出一个压缩的和未压缩的版本

    第一步:安装

    cnpm install  gulp --save-dev 
    cnpm install gulp-rename gulp-uglify --save-dev

    第二步:

    mkdir Gulp-demo && cd Gulp-demo
    cnpm init -y

    我的目录结构如下:

      webpack-demo
      |- package.json
      |- /build
        |- 无(压缩后的文件将被放在这)
      |- /src
        |- jquery-3.3.1.js (原文件,待操作文件)

    第三步:编辑

    gulpfile.js文件,此文件配置Gulp的行为,就是我想让Gulp去帮我干什么事情,每件事情以 task(任务)为基本单位

    gulpfile.js

    'use strict';
    
    var gulp = require('gulp');
    var rename = require('gulp-rename');
    var uglify = require('gulp-uglify');
    
    var DEST = 'build/';
    
    gulp.task('default', function() {
      return gulp.src('./src/jquery-3.3.1.js')
        // 这会输出一个未压缩过的版本
        .pipe(gulp.dest(DEST)) //传入输出路径并输出文件
        
        // 这会输出一个压缩过的并且重命名未 foo.min.js 的文件
        .pipe(uglify()) //执行压缩
        .pipe(rename({ extname: '.min.js' })) //修改文件名为min.js,以示区分
        .pipe(gulp.dest(DEST)); //传入输出路径并输出文件
    });

    成功啦!

  • 相关阅读:
    SSLOJ 1338.逃亡路径
    文件上传与下载
    TCP协议和UDP协议
    DWR推技术在开发中需要注意的ScriptSession问题
    页面缓存-freemarker静态处理
    springMVC的工作流程
    hibernate的工作流程
    Struts2框架的大致流程
    mybatis中的多表查询
    传值乱码解决方案
  • 原文地址:https://www.cnblogs.com/ww01/p/9807247.html
Copyright © 2011-2022 走看看