gulp 基本使用
1. 安装
npm install -g gulp-cli && npm install --save-dev gulp
or with yarn
yarn global gulp-cli && yarn add gulp
2. 使用
基本流程
1. gulp cli 启动命令行工具
2. 本地gulp
3. gulpfile 构建的命令文件
4. gulp plugins 进行合并,修改,组装文件的插件
// 安装件1
3. 简单使用
// yarn 方式 npm 方式类似,yarn 更快
yarn init
//package.json scripts 修改
"scripts": {
"run": "node index.js",
"dev": "node index",
"test": "gulp test"
}
yarn add --dev gulp
touch Gulpfile.js
var gulp = require("gulp")
gulp.task("test",()=>{
console.log("this is a demo")
});
// 运行
yarn run test
4. 效果

5. 使用sftp 插件发布
因为我们的开发都是要部署到服务器的,有好多方式可选,gulp 的sftp 插件就比较方便,直接拷贝到服务器
这样我们在做ci/cd 的时候是比较方便的(一般使用jenkins 或者类似的功能需要进行账户配置)
可以使用此工具修改传统应用部署,发布的模式(可以自己进行扩展)
类似的工具有gulp-ssh
// 插件安装
yarn add --dev gulp-sftp
// 修改Gulpfile.js
var sftp = require('gulp-sftp');
gulp.task('deploy', function () {
return gulp.src('/*')
.pipe(sftp({
host: 'XXXXXX',
user: 'user',
pass: 'passsword',
remotePath:"pathtodeploy"
}));
});
// 修改package.json scripts
"scripts": {
"run": "node index.js",
"dev": "node index",
"test": "gulp test",
"deploy":"gulp deploy"
}
// 运行
yarn run deploy
输出如下:
yarn run v1.3.2
$ gulp deploy
[12:36:57] Using gulpfile ~/appdemo/Gulpfile.js
[12:36:57] Starting 'deploy'...
[12:36:58] Authenticating with password.
[12:36:58] SFTP error or directory exists: Error: Failure /root/deploysite
[12:36:58] gulp-sftp: Uploaded: Gulpfile.js => /root/deploysite/Gulpfile.js
[12:36:58] gulp-sftp: Uploaded: index.js => /root/deploysite/index.js
[12:36:58] gulp-sftp: Uploaded: package.json => /root/deploysite/package.json
[12:36:58] gulp-sftp: Uploaded: yarn.lock => /root/deploysite/yarn.lock
[12:36:58] SFTP error or directory exists: Error: Failure /root/deploysite/node_modules
[12:36:58] SFTP error or directory exists: Error: Failure /root/deploysite/node_modules/ansi-regex
[12:36:58] gulp-sftp: Uploaded: node_modules/ansi-regex/index.js => /root/deploysite/node_modules/an
..............
6. 参考资料
https://www.npmjs.com/package/gulp-ssh
https://www.npmjs.com/package/gulp-sftp
http://www.gulpjs.com.cn/docs/getting-started/
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 全程不用写代码,我用AI程序员写了一个飞机大战
· DeepSeek 开源周回顾「GitHub 热点速览」
· 记一次.NET内存居高不下排查解决与启示
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· .NET10 - 预览版1新功能体验(一)
2013-11-11 原有系统各模块的设计分析------消息服务器模块