手动部署
- 这里我讲解部署
vue项目· - 所需工具
xshell和xftp(可有可无。可以减少命令实现部分工作)- 打包:
npm run build
- 进行部署
采用xshell配合xftp手动copy文件覆盖
- 使用xshell连接云服务器，再使用nginx指向打包文件的地址路径，然后将打包好的文件放在指定路径
自动化部署
天天重复上边的工作无非觉得浪费时间了，乍一看
nodejs好像可以帮我们实现连接服务器并且上传文件等，可以省去这部分繁琐工作，让我们开始吧！~
安装依赖
"inquirer": "^8.2.0",
"ssh2-sftp-client": "^9.0.4"
Inquirer是常规交互式命令行用户接口的集合，提供给 Node.js 一个方便嵌入，漂亮的命令行接口，用于命令行提示交互ssh2-sftp-client为 node.js 基于 ssh2 封装的， SFTP客户端，用于连接操作服务器
编写
在项目根目录下创建文件夹
deploy方便管理
- 编写命令行交互文件
helper.js
const inquirer = require('inquirer')
new inquirer.Separator()
const selectTip = 'project name:'
const options = [
{
type: 'checkbox',
name: selectTip,
message: `您希望把项目部署到哪个环境？`,
choices: []
}
]
// 显示选择提示窗
function showHelper (config) {
console.log("config=",config)
return new Promise((resolve, reject) => {
initHelper(config) // 初始化helper
inquirer.prompt(options).then(answers => {
console.log(answers,answers[selectTip],selectTip)
resolve({
value: findInfoByName(config,["测试环境"]) }) // 查找所选配置项
}).catch((err) => {
reject(console.error(' helper显示或选择出错！', err))
})
})
}
// 初始化helper
function initHelper (config) {
for (let item of config) {
options[0].choices.push(item.name)
}
console.log('正在检查全局配置信息...')
// 检查是否存在相同name
if (new Set(options[0].choices).size !== options[0].choices.length) {
console.error('请检查配置信息，存在相同name！')
process.exit()
}
}
// 查找符合条件的配置项
function findInfoByName (config, nameArr) {
console.log("自定义配置",config,"选中的环境",nameArr)
const arrInfo = []
for (let item of config) {
for(let name of nameArr) {
console.log(name,item)
if(item.name === name) {
arrInfo.push(item)
}
}
}
return arrInfo
}
module.exports = showHelper
- 编写操作服务器进行上传发布文件
ssh.js
const Client = require('ssh2-sftp-client')
const helper = require ('./helper')
const config = [
{
name: '测试环境',
enviroment: 'development',
ssh: {
host: '你的服务器地址',
port: 22,//端口号
username: '服务器用户名',
password: '服务器密码',
},
romotePath: '/lvdu/appHtml',// 远程地址
localPath:'../dist',// 本地地址
}
]
function connect(config) {
const sftp = new Client()
return sftp
.connect(config.ssh)
.then(() => {
console.log(`正在部署 ${
config.name}`)
return sftp.uploadDir(config.localPath, config.romotePath)
}).finally(() => {
sftp.end()
})
}
async function main() {
const ps = []
const table = []
const SELECT_CONFIG = (await helper(config)).value // 所选部署项目的配置信息
console.log(SELECT_CONFIG)
for(let config of SELECT_CONFIG) {
table.push({
enviroment: config.enviroment,
status: 'OK'
})
ps.push(() => connect(config))
}
const p = Promise.resolve()
ps.reduce((p, c) => {
return p.then(c)
}, p).then(() => {
console.log('success completed')
console.table(table);
}).catch((err) => {
console.log(err,'出了点问题，快去看看吧~~')
})
}
main()
- 最后可编写脚本文件
deploy.sh用于执行上方文件，也可手动执行
echo "正在打包 "
npm run build
node ./ssh.js
如果手动执行就需要先
npm run build
再 node ssh.js
以上方式即可实现自动化部署
tip:该方式只适用于本地个人使用，切勿上传仓库，防止服务器账号密码泄露
如果觉得该文章对你有帮助就快来学习交流群一起学习吧✊~