一、Gulp的使用

  1. 使用npm install  gulp  下载gulp库文件

  2. 在项目根目录下简历gulpfile.js文件

  3. 重构项目的文件夹架构src目录放置源代码文件,dist目录防止构建后文件。

  4. 在gulpfile.js文件中编写任务

  5. 在命令行工具中执行gulp任务。

二、Gulp中提供的方法

  1. gulp.src(0 获取任务要处理的文件

  2. gulp.dest() 输出文件

  3. gulp.tast()  简历gulp任务

  4. gulp.watch()  监控文件的变化

/**
* 以下代码实现的功能相当于复制了一些东西
*/ // 引入gulp模块
const gulp = require('gulp')
// 使用gulp.task() 方法建立任务
gulp.task('first',()=>{ // 这里first是任务名称,后面是回调函数,用来处理该任务的;
// 获取要处理的文件
gulp.src('./src/css/base.css') // 将处理后的文件输出到dist目录
.pipe(gulp.dest('./dist/csss'))
})

三、安装gulp用的命令行工具:gulp-cli

  在终端中执行命令:npm install gulp-cli  -g

  通过执行该命令,可以在全局安装gulp的命令行工具。

  ** 安装好全局gulp命令工具以后,可以通过gulp命令执行文件了。

【这几个链接里面有几个小问题的解决方案】

https://blog.csdn.net/qq_41208114/article/details/79109269

https://blog.csdn.net/WU5229485/article/details/90173693

四、gulp 插件

  1. gulp-htmlmin :  HTML文件压缩插件

  2. gulp-csso  :  压缩css

  3. gulp-babel : JavaScript 语法转化   如es6转化成es5

  4. gulp-less : less语法转化

  5. gulp-uglify : 压缩混淆 JavaScript

  6. gulp-file-include: 公共文件包含

  7. browsersync  浏览器实时同步

**插件的使用很简单:只需要三步:

  1、下载插件

  2、引入插件

  3、使用插件

例如:下载gulp-htmlmin插件

1.  npm install  gulp-htmlmin

第三方模块:gulp模块的更多相关文章

  1. 第三方模块Gulp

    1.第三方模块Gulp 基于node平台开发的前端构建工具. 将机械化操作编写成任务,想要执行机械化操作时执行一个命令,命令任务就能自动执行了.提高开发效率. 1)Gulp使用 ① 使用npm ins ...

  2. 【Python】[模块]使用模块,安装第三方模块

    一个.py文件就称之为一个模块(Model)按目录来组织模块的方法,称为包(Package)每一个包目录下面都会有一个__init__.py的文件内置函数1.使用模块 导入模块 import sys ...

  3. Python【第三方模块&标准模块】

    模块: 模块其实就是一个python文件 1.标准模块.标准包 #python自带的这些模块,直接import就能用的 import string,random,datetime,os,json 2. ...

  4. [如何在mac下使用gulp] 2. gulp模块的常用方法

    常用的gulp模块方法有: gulp.src() gulp.src('client/one.js'); //指定明确的要处理文件 gulp.src('client/*.js'); //处理client ...

  5. nginx内置高可用配置与第三方高可用模块nginx_ustream_check_mudule配置

    1. nginx 第三方高可用模块 IP 备注 10.0.0.63 proxy 10.0.0.64 web1 10.0.0.65 web2 这里会讲解一些nignx常用高可用方案,以及引入第三方高可用 ...

  6. Python的模块,模块的使用、安装,别名,作用域等概念

    所谓的模块就是将不同功能的函数分别放到不同的文件中,这样不仅有利于函数的维护,也方便了函数的调用.在Python中,一个.py文件就是一个模块(Module). 在模块的上层有一个叫做包(Packag ...

  7. nginx模块,模块的配置使用

    nginx模块官方模块(默认支持的)第三方模块 1. --with-http_stub_status_module nginx的客户端状态 配置syntax: sub_status;default:- ...

  8. Python之旅Day4 闭包函数 模块及模块倒入

    闭包函数 闭包函数就是在内部函数当中有对外部函数名字的引用 ###代码示例1### def f1(): x =1 def f2(): print(x) return f2 f=f1() f() ### ...

  9. Python全栈之路----常用模块学习----模块的种类和导入方法

    什么是模块? 在计算机程序的开发过程中,随着程序代码越写越多,在一个文件里代码就会越来越长,越来越不容易维护. 为了编写可维护的代码,我们把很多函数分组,分别放到不同的文件里,这样,每个文件包含的代码 ...

随机推荐

  1. webUploader---实现大文件断点续传

    核心原理: 该项目核心就是文件分块上传.前后端要高度配合,需要双方约定好一些数据,才能完成大文件分块,我们在项目中要重点解决的以下问题. * 如何分片: * 如何合成一个文件: * 中断了从哪个分片开 ...

  2. [Usaco2007 Jan]Balanced Lineup排队

    [Usaco2007 Jan]Balanced Lineup排队 Time Limit: 5 Sec Memory Limit: 64 MB Submit: 2333 Solved: 1424 Des ...

  3. 网页结构树DOM

    引入 window对象 所有浏览器都支持 window 对象.它表示浏览器窗口. *如果文档包含框架(frame 或 iframe 标签),浏览器会为 HTML 文档创建一个 window 对象,并为 ...

  4. 在线前端 JS 或 HTML 或 CSS 编写 Demo 处 JSbin 与 jsFiddle 比较

    JSBin 该编辑器的特点是编写可直接编写 HTML.CSS.JavaScript 并且可以在 output 中实时观察编写效果:可设置自动运行 JavasScript 代码,其中最大的好处是有一个 ...

  5. Selenium 详解xpath定位

    xpath定位在业界被戏称为元素定位的"屠龙宝刀",宝刀在手,武林我有.现在我们就来详解xpath定位方法. 一.xpath通过元素属性定位 xpath可以通过元素的属性来定位,如 ...

  6. nbu还原集群数据库异常问题

    集群数据库软件均已安装完毕,现在想从NBU上还原数据库,但在还原控制文件报错 [oracle@oracle-db1 ~]$ rman target / Recovery Manager: Releas ...

  7. android日志优先级

    Android 的日志分为如下几个优先级(priority): V —— Verbose(最低,输出得最多) D —— Debug I —— Info W —— Warning E —— Error ...

  8. linux文件重定向

    1:标准输出:2:错误输出 1,exec启动一个新的shell将STDOUT文件描述符重定向到文件 #!/bin/shecho "test exec..."exec > ou ...

  9. matplotlib画图——条形图

    一.单条 import numpy as np import matplotlib.pyplot as plt N = 5 y1 = [20, 10, 30, 25, 15] y2 = [15, 14 ...

  10. WIN10下安装Linux子系统并安装xface4界面

    WIN10下安装Linux子系统并安装xface4界面,使用win10自带的远程桌面工具登陆成功. 成功截图: 安装步骤 1.安装[适用于Linux的Windows子系统]组件 2.win10应用商店 ...