gulp自动化构建工具的使用(常见插件的使用)

gulp自动化构建工具:

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

安装:

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

  A.下载安装:

  cnpm:cnpm i gulp -g

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

  yarn:   yarn global add gulp

  B.测试

  gulp -v

扫描二维码关注公众号,回复: 6004556 查看本文章

     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核心模块
      1 var gulp =require('gulp');
    • 配置gulp任务 :语法:gulp.task(name[, deps], fn)
      • 参数:
        name 任务名称
        deps 可选,包含任务列表的数组
        fn 回调函数,任务执行的代码

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

      

    •   执行任务
      •   gulp 任务名称  或者  gulp 任务名称是default就可以省略
        1 gulp myTask(任务名)

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

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

    

    

猜你喜欢

转载自www.cnblogs.com/nanxiaoge/p/10765705.html