通过gulp直接将vue项目打包并且上传到服务器
当我们写vue项目的时候,往往要先进行项目打包,然后再上传到我们的服务器,这样每次重复,感觉特别麻烦,这个时候我们就可以通过glup来帮我们解决问题首先我们在项目新建一个gulpfile.js文件然后安装两个东西npm install --save-dev gulp gulp-sftp接着在gulpfile.js里面const gulp = require('gulp')const ftp = r
·
当我们写vue项目的时候,往往要先进行项目打包,然后再上传到我们的服务器,这样每次重复,感觉特别麻烦,这个时候我们就可以通过glup来帮我们解决问题
首先我们在项目新建一个gulpfile.js文件
然后安装两个东西
npm install --save-dev gulp gulp-sftp
接着在gulpfile.js里面
const gulp = require('gulp')
const ftp = require('gulp-sftp')
const config = {
uploadTest: {
remotePath: '', // 部署到服务器的路径
host: '', // ip地址
auth: '', //可以随便起
port: , // 端口
user: '', //用户名
pass: '' //密码
},
publicPath: '/dist/', // 本地程序编译好路径
}
/**
* 清除本地程序编译好的路径目录文件
*/
const del = require('del')
gulp.task('clean', ['upload'], function(callback) {
console.log('## 已经成功部署到服务器上')
console.log('## 清除原来编译的代码')
del(['.' + config.publicPath], callback)
})
/**
* 部署到测试环境
*/
gulp.task('upload', function(callback) {
console.log('## 正在部署到测试服务器上')
var dev = config.uploadTest
gulp.src('.' + config.publicPath + '**')
.pipe(ftp(Object.assign(dev, { callback })))
})
gulp.task('uploadTest', ['upload', 'clean'])
然后我们在package.json里面
scripts里面新添加一个
"upfiletest": "npm run build && gulp uploadTest"
之后通过npm run upfiletest,就可以同时打包并且上传了
更多推荐
已为社区贡献25条内容
所有评论(0)