当前位置: 首页 > article >正文

阿里云效一键部署前后端

静态站点到OSS

阿里云-云效,阿里云企业级一站式 DevOps,可以免费使用(会限制人数、流水线数量等,个人项目够用了)。相关文章 CI 持续集成 - 阿里云云效

OSS 是对象存储的意思,一般一个项目对应一个 Bucket (存储桶),可以通过一个地址来访问里面的文件,配置成静态站点后,将自己的域名通过 CNAME 解析到该地址,项目就能访问了

CI/CD 一般需要找到流水线设置,常规前端项目自动化部署一般分为 4 个阶段

  1. 添加流水线源
  2. 测试
  3. 构建上传
  4. 部署

添加流水线源

Github、码云第一次弄需要先授权才会有服务连接

image-20231130151625258

测试

添加单元测试,这里我就不添加了

image-20231130155325894

构建

设置构建命令,构建生成文件目录,选择所需要的 Node 版本

image-20231130152326643

OSS 上传,第一次弄,需要先进入阿里云对象 OSS,创建 Bucket

image-20231130152826801

设置进行赋权操作,选择对应的 Bucket

image-20231130152901155

前端构建流水线

前端部署在 OSS 上即可,其优点:

  1. 前后端部署服务位置分离,防止服务器被 ddos 攻击后,静态站点、接口服务全挂掉
  2. OSS 访问速度很快,带宽不低

image-20231130164729866

Node服务到云服务器

部署

选择主机部署

image-20231130155258111

第一次弄需要先点击新建主机组,我的是阿里云ECS

image-20231130155539032

选择对应的服务添加对应的主机,之后添加对应标签及内容

image-20231130160026574

修改对应署脚本

image-20231130164934800

# 持续集成
cd /home/template/vue-node-mooc/server/
echo "git pull"
git pull

# 查看最近一次提交 log
echo "git log -1"
git log -1 

pnpm install

echo 'server restart'
pm2 delete vue-read
pm2 start app.js -n vue-read

后端部署流水线

image-20231130165027389


http://www.kler.cn/a/158188.html

相关文章:

  • mysql中锁的具体使用
  • 【openssl】Window系统如何编译openssl
  • Mysql 行转列,把逗号分隔的字段拆分成多行
  • 04.里氏替换原则(Liskov Substitution Principle)
  • 三、C语言常见概念
  • 利用document.write阻塞js文件加载
  • React都有哪些hooks?
  • git常用命令小记
  • 数据结构——希尔排序(详解)
  • 在Vue3中使用缓存组件keep-alive vue3缓存组件
  • XXL-Job详解(三):任务开发
  • java--抽象类的常见应用场景:模板方法设计模式
  • PTA 7-230 美好日子
  • 【电路笔记】-电阻器额定功率
  • 降本提效!阿里提出大模型集成新方法
  • JS 实现一键复制文本内容
  • 面向注解编程—Spring 注解看这一篇就够了
  • 蓝桥杯算法心得——想吃冰淇淋和蛋糕(dp)
  • 迅速认识什么是格雷码,格雷码和二进制怎么进行转换
  • 华纳云:Tomcat无法加载css和js等静态资源文件怎么解决