- 综合排序
- 最热优先
- 最新优先
- 来自专栏一个会写诗的程序员的博客
Gulp 快速入门gulp API 文档
package.json { "devDependencies": { "gulp": "^3.9.1", "gulp-browserify": "^0.5.1", "gulp-jade ": "^1.1.0" } } gulpfile.js var gulp = require('gulp'), jade = require('gulp-jade'), browserify = require('gulp-browserify') gulp.task('jade', function () { return gulp.src('src/template/**/* .jade') .pipe(jade()) .pipe(gulp.dest('builds/development')) }) gulp.task('js', function () { return gulp.src('src/js/main.js') .pipe(browserify({debug: true})) .pipe(gulp.dest
96620发布于 2018-08-17 - 来自专栏河湾欢儿的专栏
gulp
简单介绍 gulp是基于node开发的所以可以使用npm这个nodejs的包管理工具安装gulp，使用npm首先得配置node环境 Install npm install gulp-cli - g 全局安装gulp gulp --help 返回帮助信息 package.json npm init 初始化npm npm install gulp gulp-util --save-dev //从本地把整个gulp文件夹拉过来 task 创建gulpfile.js文件 var gulp=require('gulp'); gulp.task('hello', /xiangmu/dist')); }); 复制img文件 var gulp=require('gulp'); gulp.task('hello', function () { return gulp.src /xiangmu/dist')); }); 排除其它的文件 var gulp=require('gulp'); gulp.task('hello', function () { return gulp.src
1.3K10发布于 2018-09-06 - 来自专栏全栈程序员必看
gulp pipe缓存_gulp使用教程
首先，gulp的源码里没有任何一部分是定义pipe的。 gulp的pipe方法是来自nodejs stream API的。 gulp本身是由一系列vinyl模块组织起来的。 pipe跟他字面意思一样只是一个管道 例如我有一堆文件 var s = gulp.src(["fileA","fileB","fileC"]) src方法实际上是'vinyl-fs'模块的方法,选择一系列文件并创建可读流 方法只负责返回这个管道结构（Stream对象） 楼主想要窥探管道里的内容，就要创建一个Stream对象，在Stream对象接收结果的方法里把流里的内容log出来即可 Stream与File 注意的是gulp 里的流的file必须是vinyl对象 var File = require("gulp-utils").File //或者 var File = require("vinyl") var myf =
1K20编辑于 2022-11-15 - 来自专栏零域Blog
Gulp构建实例
gulp $ npm install gulp -g 进入到需要 gulp 管理的项目路径，如 /gulp 再安装一遍 $ npm install gulp --save-dev 安装 gulp 插件 $ npm install --save-dev gulp-ruby-sass gulp-autoprefixer gulp-minify-css gulp-jshint gulp-concat gulp-uglify gulp-imagemin gulp-notify gulp-rename gulp-livereload gulp-cache del sass的编译 (`gulp-ruby-sass`) 自动添加 css前缀（`gulp-autoprefixer`） 压缩css（`gulp-minify-css`） js代码校验（`gulp-jshint`） 合并js文件（`gulp-concat`） 压缩js代码 （`gulp-uglify`） 压缩图片（`gulp-imagemin`） 自动刷新页面（`gulp-livereload`） 图片缓存，只有图片替换了才压缩（`gulp-cache`） 更改提醒（`gulp-notify
2.4K40编辑于 2022-03-22 - 来自专栏web前端踩坑
gulp 错误集锦
运行gulpfile文件时报错 报错内容： TypeError: gulp.on(...).on(...).on(...).on(...)\.start is not a function 问题分析： 一般这种情况是因为gulp版本引起的。 gulp本地版本和全局版本 解决方法： gulp4.0.0更新变动较大，可以考虑把本地版本和全局版本都切回3.9.1版本。 也有其他解决方法，详见参考文章2. npm install --save-dev gulp@3.9.1 npm install -g gulp@3.9.1 参考文章： gulp和gulp-cli的区别 Gulp error: gulp.hasTask is not a function Mismatch in gulp local and CLI versions 2. gulp-uglify压缩js
1.7K10发布于 2020-11-05 - 来自专栏epoos.com
Gulp基本用法
Gulp是一个模块化打包工具。 Gulp本身只有几个入口，支持他拥有强大功能的是各种各样的插件。 Gulp的使用看起来非常简单，只需要一个一个任务链式执行就可以了，它还可以与Webpack结合起来使用 比如将Webpack作为一个插件来处理ES6转换为ES5的操作。 下面记录一下Gulp的API以及一些用到的插件。 请查看上述的 gulp.src 来了解更多信息。 ---- gulp.watch(glob[, opts], tasks) 监视文件，并且可以在文件发生改动时候做一些事情。
96830编辑于 2022-06-06 - 来自专栏生如夏花绚烂
Gulp基本使用
1.基本使用 npm i gulp-cli -g npm i gulp -D cnpm i gulp gulp-uglify gulp-concat 2.创建文件gulpfile.js键入如下 const gulp = require('gulp'); const uglify = require('gulp-uglify'); const concat = require('gulp-concat') /bunld/js/bundle.min.js 运行命令 gulp 返回如下 $ gulp [08:51:09] Using gulpfile ~\Desktop\nodejs\gulp\gulpfile.js @babel/core @babel/preset-env -D const gulp = require('gulp'); const uglify = require('gulp-uglify') -D const gulp = require('gulp'); const concat = require('gulp-concat'); const cssmin = require('gulp-cssmin
1.3K10编辑于 2022-09-08 - 来自专栏deepcc
gulp插件
gulp是趋势 gulp完全开发指南 => 快来换掉你的Grunt吧 gulp的工作流程：文件流--文件流--文件流......因为grunt操作会创建临时文件，会有频繁的IO操作，而gulp使用的是流操作 因此gulp在效率上确实远胜grunt，并且学习成本不高，在这非常感谢刘剑辛的分享！ // 本地使用gulp npm install --save gulp-imagemin // 压缩图片 npm install --save gulp-minify-css //压缩css npm install --save gulp-ruby-sass //sass npm install --save gulp-jshint //js代码检测 npm install --save gulp-uglify q=gulp
1.3K50发布于 2018-05-16 - 来自专栏网络收集
Gulp插件
（9）Gulp插件 gulp-htmlmin ：html文件压缩 gulp-csso ：压缩css gulp-babel ：JavaScript语法转化 gulp-less: less语法转化 gulp-uglify ：压缩混淆JavaScript gulp-file-include 公共文件包含 browsersync 浏览器实时同步 6、package.json （1）node_modules文件夹的问题 文件夹以及文件过多过碎 install 包名 --save-dev命令将包添加到package.json文件的devDependencies字段中 { "devDependencies": { "gulp
73310编辑于 2022-05-21 - 来自专栏meishadevs的前端专栏
使用Gulp
/gulpjs/gulp/blob/master/docs/API.md Gulp中文API：http://www.gulpjs.com.cn/docs/api/ Gulp的安装与使用 Gulp的简单应用 全局安装Gulp npm install --global gulp 2. npm install --save-dev gulp 7.创建一个Gulp的主文件gulpfile.js，并且在gulpfile.js中添加下面的代码 Gulp主文件用于注册任务 //载入gulp 的主文件gulpfile.js，并且在gulpfile.js中添加下面的代码 //载入gulp模块 var gulp = require('gulp'); //文件拷贝任务 gulp.task('copy 文件夹下的index.html中 使用Gulp自动将Less编译成CSS 下面的操作都是在项目中安装了Gulp的情况下进行的，没有安装Gulp可以看前面的Gulp的安装与使用中的内容 1.安装gulp-less
1K30编辑于 2023-04-13 - 来自专栏carven
gulp尝试开发
在实习的公司做web开发，gulp 是经常用到的，可是我做的不仅仅的前端，还包括后台， 所以将前端文件移至后台这种事当然也需要我做啦，用gulp，但是，文件移至后台目录后，资源文件的路径必须修改， （我做的后台的是用 开发流程 参考了几篇博客 Gulp插件制作指南 Gulp：插件编写入门 先来看一下插件的全部代码 'use strict'; var gutil = require('gulp-util'); var '); var through = require('through2'); gulp-util： 错误日志打印模块，按照gulp的统一规范打印错误日志 through2： Node Stream的简单封装 var gulp = require('gulp'); var replace = require('gulp-url-replace') gulp.task('move', function(){ github上 gulp-url-replace
72600发布于 2018-08-08 - 来自专栏静晴轩
Gulp折腾之路(III)
gulp-autoprefixer:Prefix CSS gulp.task('autoprefixer', function () { return gulp.src( ['src/css/* gulp-useref | gulp-rev 活久见是蛮有意思的，如此就可以更多体验那些存在；这两个插件也是在用了webpack之后，接触别的古董型项目才了解到的；这 gulp-useref 她可以把 gulp-order: 指定次序 The gulp plugin gulp-order allows you to reorder a stream of files using the same syntax ： gulp.task('mergeJs', function(){ gulp.src('. ---- 猜你喜欢： Gulp探究折腾之路(I) Gulp折腾之路(II)
1.4K50发布于 2018-03-27 - 来自专栏IMWeb前端团队
精通gulp常用插件
博客地址：blog demo地址：gulp-plugins 匹配符 *、**、！、{} gulp.src('. var rename = require("gulp-rename"); gulp.src('. /dist')); gulp-concat 描述：合并文件。 var concat = require('gulp-concat'); gulp.src('. /dist')) gulp-csso 描述：压缩优化css。 var csso = require('gulp-csso'); gulp.src('. /dist')) gulp-sass 描述：编译sass。 var sass = require('gulp-sass'); gulp.src('.
1.6K90发布于 2018-01-08 - 来自专栏游戏开发之旅
gulp的使用
": { "browser-sync": "^2.24.4", "gulp": "^3.9.1", "gulp-autoprefixer": "^5.0.0", "gulp-cache ": "^1.0.2", "gulp-concat": "^2.6.1", "gulp-concat-folders": "^1.3.1", "gulp-connect": "^ 5.5.0", "gulp-cssnano": "^2.1.3", "gulp-imagemin": "^4.1.0", "gulp-rename": "^2.0.0", 监听任务 依赖包引用 var gulp=require('gulp'); var cssnano=require('gulp-cssnano'); var rename=require('gulp-rename '); var uglify=require('gulp-uglify'); var concat=require('gulp-concat'); var cache=require('gulp-cache
1.6K20发布于 2020-08-14 - 来自专栏csxiaoyao
Gulp学习笔记
Gulp学习笔记 1. 安装 Gulp.js npm install -g gulp 2. npm 安装 npm install --save-dev gulp-uglify gulp-concat 2.4 创建配置文件 创建 gulpfile.js 文件 // 定义依赖项和插件 var gulp =require('gulp'), gutil=require('gulp-util'), uglify=require('gulp-uglify'), concat=require ('gulp-concat'); // 定义名为 "js" 的任务 gulp.task('js', function(){ gulp.src('. /js/*.js', ['js']); }); // 定义默认任务 gulp.task('default', ['js']); 3. 运行 gulp
965120发布于 2018-05-11 - 来自专栏jeremy的技术点滴
gulp替换webpack
/node_modules/.bin/gulp", "gulp-production": ". ": "^3.9.1", "gulp-clean-css": "^2.3.2", "gulp-concat": "^2.6.1", "gulp-connect": "^5.0.0 ", "gulp-connect-reproxy": "^0.0.98", "gulp-css-image-rev": "^1.0.4", "gulp-htmlmin": "^3.0.0 ", "gulp-if-else": "^1.0.3", "gulp-less": "3.3.0", "gulp-run-sequence": "^0.3.2", "gulp-sourcemaps ": "^1.9.1", "gulp-uglify": "^2.0.0", "gulp-util": "^3.0.7", "gulp-version-number": "^0.1.5
2.9K40发布于 2018-05-10 - 来自专栏乱码李
Gulp 快速入门
什么是 gulp 简单的讲，gulp 是一个构建工具，一个基于流的构建工具，一个 nodejs 写的构建工具，使用 gulp 的目的就是为了自动化构建，提高程序员工作效率。 $ npm install gulp-uglify --save-dev (4) 使用 gulp 压缩 index.js 并将结果输出 var gulp = require('gulp'); var (6) 使用 ES6 编写 gulpfile.babel.js import gulp from 'gulp'; import babel from 'gulp-babel'; // 语法转化+压缩 gulp.task (1) 安装 gulp-watch $ npm install gulp-watch --save-dev (2) 新增 task gulp.task('watch', () => { gulp.src var gulp = require('gulp'); gulp.task('one', () => { console.log('one'); }); // two 依赖 one gulp.task
1.1K10发布于 2021-11-26 - 来自专栏李维亮的博客
gulp使用教程
这个文件保存项目的相关信息 第二: npm install gulp -g 安装全局gulp 然后在项目里的根目录再安装一遍 npm install gulp –save-dev 第三: 新建一个gulpfile.js 文件 然后安装js代码检测插件，压缩文件插件，重名名插件(这里只讲一下这三个插件的使用，当然gulp还有很多强大的插件) js代码检测插件： npm install gulp-jslint –save-dev 压缩文件插件： npm install gulp-uglify –save-dev 重名名插件： npm install gulp-rename –save-dev 再安装一下npm install jslint 然后在gulpfile.js文件里面编写gulp任务代码 var gulp = require("gulp"), jshint = require("gulp-jshint"), uglify = require("gulp-uglify"), rename = require("gulp-rename"); gulp.task("scripts",function
77540发布于 2021-07-09 - 来自专栏前端技术开发
快速搭建gulp项目实战
安装Gulp环境 1.安装全局环境，运行命令 npm install gulp –g 3. gulp.src 找到执行文件 gulp.dest 执行任务的文件去出 gulp.watch 观察文件是否发生变化 4.安装一些常用的压缩包 cnpm install gulp-minify-css gulp-uglify gulp-concat --save-dev ///////////////// 1.css压缩 gulp-minify-css 2.js压缩 gulp-uglify var gulp = require('gulp'); gulp.task("copyHtml",function(){ gulp.src("src/*.html") //当前目录下所有的html 文件 .pipe(gulp.dest("dist")) //文件的去处 }) dist是通过 gulp copyHtml生成的文件夹 常用的代码压缩 var gulp = require('gulp
1.3K20发布于 2019-09-23 - 来自专栏踏浪的文章
Gulp使用指南
的版本 gulp@3 => 安装成功检测版本号, gulp 3.9.1 gulp@4 => 安装成功检测版本号, gulp cli 2.3.0 gulp 全局工具安装完毕 能给你的电脑提供一个启动 gulp 全局依赖环境 gulp + 一台电脑安装一次, 以后使用就可以了 + 再命令行提供 gulp xxx 的能力 + 指令 $ npm install --global gulp 常用Api gulp 的常用 API + 前提: 下载 gulp 第三方, 导入以后使用 1. gulp.task() => 语法: gulp.task(任务名称, 任务处理函数) => }) 2. gulp.src() => 语法: gulp.src(路径信息) => 作用: 找到源文件 => 书写方式 2-1. gulp.src('. > gulp-babel 的版本 -> gulp-babel@7: 大部分使用再 gulp@3 里面 -> gulp-babel@8: 大部分使用再 gulp@4 里面 => 下载:
1.3K10发布于 2021-06-09
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号