zoukankan      html  css  js  c++  java
  • Gulp

    一、Gulp:

      Gulp 是基于node.js的一个前端自动化构建工具,开发这可以使用它构建自动化工作流程(前端集成开发环境)。 使用gulp你可以简化工作量,让你把重点放在功能的开发上,从而提高你的开发效率和工作质量。(gulp是基于node.js开发的)

    二、Gulp的安装:

    1、先安装node.js;

    2、全局安装gulp 打开cmd 命令行窗口安装:

    命令: npm install -g gulp@3.9.1     gulp的全局安装

    检查gulp是否安装成功:  gulp -v

    3、局部安装  在项目目录中安装gulp :

    在该项目目录下进行局部安装gulp  命令是:

    进入到项目目录下:

      npm install --save-dev gulp@3.9.1   局部安装gulp的命令

    安装成功后,通过 gulp-v 确定安装是否成功!

    接下来的操作都在项目目录下完成:

    4、配置package.json文件:

    命令:

      npm init -y/npm init

    5、安装gulp 插件

    命令:

      npm install --save-dev 插件名称

    例如:

    npm install --save-dev gulp-cssmin

    npm install --save-dev gulp-uglify

    gulp-sass 将sass文件转成css文件(有可能安装不上---选择性安装)

    gulp-cssmin 压缩css文件

    gulp-uglify 压缩js文件

    gulp-concat 合并文件

    gulp-rename 重命名

    使用npm命令移出所依赖的模块:npm utinstall package名称 -save

    三、Gulp使用方法:

    1、在项目下打开命令行

    2、运行gulp命令,会有提示No gulpfile found

    3、在项目根目录下创建一个文件 gulpfile.js

    4、再次运行gulp 命令,会有提示:

    Task'default'is not in your gulpfile

    说明运行gulp命令时,会自动查找gulpfile中的 default 任务

    5、布置任务  default任务

    先引入 gulp 模块,使用require()方法引入,例如:var g =require("gulp");

    使用task()方法布置任务,有三个参数:

    第一个参数: 任务名称

    第二个参数:依赖的其他任务(可以省略) 是一个数组

    第三个参数:回调函数

    布置好default任务后,再次运行gulp命令,会自动输出default任务;

    也可以布置自定义任务,比如布置一个say任务,可以使用gulp say 执行该任务;

    如果一次执行多个任务,可以在task的第二个参数上,通过一个数组指定。

    6、其他方法:

    src()获取源文件路径;

    参数:可以是一个字符串或者一个数组

    dest()获取目标文件的路径

    参数:是一个字符串,该方法可以自动生成目录

    pipe() 管道方法 表示下一步

    watch() 监听方法

  • 相关阅读:
    IOS照相机的启动,图片的读取,存储demo
    ios中摄像头/相册获取图片,压缩图片,上传服务器方法总结
    AFNetworking 使用总结 (用法+JSON解析
    AFNetworking 初探
    虹吸壶的前世今生
    手摇磨豆机经验总结--2013.7.11修改
    国贸女和中关村大叔的故事以及老男孩咖啡
    Chrome 的插件(Plug-in)与扩展(Extension)的区别
    js callback && callback()
    js the difference between 'return false' and 'return true'
  • 原文地址:https://www.cnblogs.com/21-forever/p/10951640.html
Copyright © 2011-2022 走看看