当前位置:   article > 正文

前端自动化部署

前端自动化部署

实现效果:通过一条命令就可以将文件提交到服务器中
准备条件:安装scp2

npm i scp2

以vue打包的dist文件为例,实际应用场景可以是任何文件
在vue项目的根目录创建deploy.ts文件。注:如果使用的不是ts,将文中所有的ts改成js即可

  1. const scpClient = require('scp2')
  2. //测试服务器
  3. const localServer = [
  4. {
  5. host: '192.168.3.9', // 服务器地址
  6. port: 22,
  7. username: 'root',
  8. password: '123456',
  9. path: 'xxx/xxx/dist' //文件存放位置
  10. }
  11. ]
  12. // 线上服务器
  13. const longServer = [
  14. {
  15. host: '192.168.3.9', // 服务器地址
  16. port: 22,
  17. username: 'root',
  18. password: '123456',
  19. path: 'xxx/xxx/dist' //文件存放位置
  20. },
  21. ...
  22. ]
  23. let num = 0
  24. function run(arr) {
  25. scpClient.scp('./dist', arr[num], err => {
  26. if (err) {
  27. console.log(arr[num].host + '部署失败')
  28. throw err
  29. } else {
  30. console.log(arr[num].host + '部署成功')
  31. num++
  32. if (arr[num]) run(arr)
  33. }
  34. })
  35. }
  36. const args = process.argv.slice(2)
  37. run(args[0] === 'local' ? localServer : longServer)

这里服务器地址使用数组的原因是以防需要部署多台服务器。

在package.json中加入一条指令

"deploy": "npm run build && node ./deploy.ts local"

大功告成:此时,你可以使用npm run deploy执行打包命令并将打包后的dist文件发布到测试服务器;在终端使用node deploy将dist文件推送到正式服务器

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/在线问答5/article/detail/909926
推荐阅读
相关标签
  

闽ICP备14008679号