gulp自动化构建工具:

  把前端开发常见的处理(“搬砖”)程序,通过一个工具模块管理起来,只需配置一次,达到自动处理目的,简化开发,提高效率!!

安装:

 1.全局安装(全局安装一个gulp命令)

  A.下载安装:

  cnpm:cnpm i gulp -g

  如果cnpm安装有问题:可使用yarn安装

  yarn:   yarn global add gulp

  B.测试

  gulp -v

 2.本地安装(引入依赖模块,支持不同版本的项目运行)

  A.安装

   a.创建一个新文件夹,初始化package.json

    cnpm:  cnpm init -y

    yarn:  yarn init -y

   b.安装本地gulp

    cnpm:  cnpm i gulp -D(安装开发依赖:全称:--save-dev) 

    yarn:  yarn add gulp -D

   c.配置:

    • 创建一个gulpfile.js文件,与package.json同目录
    • 引入gulp核心模块
       var gulp =require('gulp');
    • 配置gulp任务 :语法:gulp.task(name[, deps], fn)
      • 参数:
        name 任务名称
        deps 可选,包含任务列表的数组
        fn 回调函数,任务执行的代码

         var gulp = require('gulp');
        
         gulp.task('default', function() {
        console.log("测试");
        });

      

    •   执行任务

      •   gulp 任务名称  或者  gulp 任务名称是default就可以省略

         gulp myTask(任务名)

-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

下一篇将介绍gulp常用插件的使用

    

    

gulp自动化构建工具的使用的更多相关文章

  1. gulp自动化构建工具

    gulp    自动化构建工具,实时监控.代码合并.压缩... http://www.gulpjs.com.cn/     中文网 http://gulpjs.com/plugins/     英文网 ...

  2. Gulp(自动化构建工具 )

    前言 Gulp,简而言之,就是前端自动化开发工具,利用它,我们可以提高开发效率. 比如: 1.  压缩js 2.  压缩css 3.  压缩less 4.  压缩图片 等等… 我们完全可以利用Gulp ...

  3. gulp自动化构建工具安装使用(1)

    我用的是windows,所以以下操作针对于windows用户,其他系统有不一样的地方请自行查阅资料更正. 好了,废话少说,反正也就是随手捣腾.下雨了,天晴了,我们开始搞gulp了 安装:gulp是个构 ...

  4. gulp自动化构建工具使用总结

    简介: gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉快的编写代码 ...

  5. Gulp自动化构建工具的简单使用

    相关网站 gulp官方网址:http://gulpjs.com gulp中文网站:http://www.gulpjs.com.cn/ gulp插件地址:http://gulpjs.com/plugin ...

  6. gulp自动化构建工具使用

    gulpfile.js: var gulp = require("gulp"); var imagemin = require("gulp-imagemin") ...

  7. 前端自动化构建工具gulp的使用总结

    前端自动化构建工具gulp的使用总结 博主最近偶的空闲,在此对gulp的使用做一个总结,让小伙伴知道如何合理的使用gulp以及gulp的使用技巧. 谈到gulp,有人可能就会想到另外一个构建工具gru ...

  8. gulp前端自动化构建工具使用

    (1)新建项目目录gulp_web (2)项目目录下建目录src里面存放需要进行gulp处理的文件目录及文件 (3)gulpfile.js文件内容为声明需要打包应用的gulp组件及打包文件路径和打包任 ...

  9. 前端开发自动化工作流工具,JavaScript自动化构建工具grunt、gulp、webpack介绍

    前端开发自动化工作流工具,JavaScript自动化构建工具grunt.gulp.webpack介绍 前端自动化,这样的一个名词听起来非常的有吸引力,向往力.当今时代,前端工程师需要维护的代码变得及为 ...

随机推荐

  1. 百度地图API实时画出动态运行轨迹(一条行驶轨迹),车头实时指向行驶方向,设置角度偏移

    参考网址:https://blog.csdn.net/skywqnan/article/details/79036262 改变车的方向:http://www.cnblogs.com/peixuanzh ...

  2. python读取数据库并把数据写入本地文件

    一,介绍 上周用jmeter做性能测试时,接口B传入的参数需要依赖接口A生成的借贷申请ID,接口A运行完需要把生成的借贷申请ID导出来到一个文件,作为参数传给接口B,刚开始的时候,手动去数据库倒, 倒 ...

  3. CentOS下软件安装与卸载常用命令总结

    最近在折腾CentOS 7操作系统,主要是下载安装文件以及解决各项依赖问题,现对此过程中用到的有效的CentOS命令进行汇总总结. 1. 安装与卸载软件:yum.rpm.wget命令 首先,在Cent ...

  4. vs2017 在win10下安装后开始运行asp.net core 项目时出错

    vs2017 在win10下安装后开始运行asp.net core 项目时出错 报找不到什么 解决方法: 下载 asp.net 2.2 安装好,重新启动电脑问题解决.

  5. 来吧学学.Net Core之项目文件简介及配置文件与IOC的使用

    序言 在当前编程语言蓬勃发展与竞争的时期,对于我们.net从业者来说,.Net Core是风头正紧,势不可挡的.芸芸口水之中,不学习使用Core,你的圈内处境或许会渐渐的被边缘化.所以我们还是抽出一点 ...

  6. 关于.net后台的异步刷新的问题

    我在.net后台做了一个功能.这里我简单话的描述这个功能. 一个下拉框,然后选择其中的不同的下拉信息,下面会有不同的材料表的显示. 其中一个表中如果有必填的字段,那么你切换这个的时候,会导致下拉框不会 ...

  7. php----------php安装xhprof扩展和简单使用

    1.下载源码包 https://github.com/longxinH/xhprof  (wget https://github.com/longxinH/xhprof/archive/master. ...

  8. python模块与路径

    # 切记不能与方法函数同名,否则会报错!!! # python的模块与包 分为三种: #1.标准库 #2.第三方模块 #3.自定义模块 #python 模块的引入原理: # 加入你创建了一个模块,在i ...

  9. 《ASP.NET Core In Action》读书笔记系列一 ASP.NET Core 的诞生

    最近打算系统学习一下asp.net  core ,苦于没有好的中文书藉,只好找来一本英文的 <ASP.NET Core In Action>学习.我和多数人一样,学习英文会明显慢于中文.希 ...

  10. 模块cv2的用法

    一.读入图像 使用函数cv2.imread(filepath,flags)读入一副图片 filepath:要读入图片的完整路径 flags:读入图片的标志  cv2.IMREAD_COLOR:默认参数 ...