前端自动化部署最佳入门实践

28 阅读1分钟

一、前端部署

1、前端项目是怎么部署的都有哪些步骤

1.1 npm run build

1.2 登录服务器找到目标路径

1.3 把我们build后的资源上传到服务器

大概是这三步,如果没有自动化部署的话这三步可能是我们在每次部署的时候都需要执行的步骤,比较繁琐,而且项目多了容易出错。

2、前端自动化部署常见的几种方式

2.1 gitee 支持配置可视化配置流水线,但是有个缺点是可视化配置只支持几个可选的node版本,如果想要任意node 版本,需要用yml 配置文件的方式去实现。 2.2 gitlab 私有化部署,需要linux服务器上面先安装部署gitlab在配置流水线,安装有一定的学习成本。

2.3 jenkens,和gitlab一样也需要先下载部署

2.4 阿里云效,比较推荐的部署方式,支持可视化配置,对新手比较友好,本编重点说这个

二、阿里云效部署前端项目 2.1 新建流水线

image.png

选择node.js. + 自有主机部署

2.2 关联自己的代码仓库

image.png

2.3 配置 node.js 构建

image.png

image.png

配置构建步骤

2.4 主机部署配置

image.png

创建nginx配置的前端资源的路径 然后把构建的压缩包解压到前端资源的路径

就可以了