使用阿里云codepipeline来持续部署前端工程（vue，react等等）教程

最新推荐文章于 2024-06-01 20:34:14 发布

weixin_34198881

最新推荐文章于 2024-06-01 20:34:14 发布

阅读量752

点赞数

文章标签： javascript 前端运维 ViewUI

原文链接：https://segmentfault.com/a/1190000016405449

版权

1、codepipeline是什么

阿里云CodePipeline是一款提供持续集成/持续交付能力，并完全兼容Jenkins的能力和使用习惯的SAAS化产品。通过使用阿里云CodePipeline，您可以方便的在云端实现从代码到应用的持续集成和交付，方便您快速的对您的产品进行功能迭代和演进。

讲人话就是，帮你构建你的项目，然后部署到你指定的服务器位置上；

2、codepipieline的流程

首先会从你指定的git地址拉取你的项目文件，然后执行构建命令（自行填写）
构建命令执行完毕后，把构建物上传到oss上；
部署服务器会从oss拉取构建物，并且自动解压到工作空间
执行部署命令

3、为什么选择使用codepipeline

不需要自己部署ci服务器，比如jenkins，也不会占用服务器资源
集成到项目里面非常简单（坑我已经给你踩了）
目前情况来开，免费的可能性非常高。阿里出了云效（另一个ci）给大中型公司使用。而codepipeline针对的是个人开发和中小公司。
可以配合钉钉使用，自动同步构建结果。非常舒服

如果本身就在使用阿里云code和阿里云服务器，就更加适合使用了

4、准备工作

因为需要上传到oss上，所以必须要开通oss。（可能会产生费用，存储1G一个月0.12元，这个应(ken)该(ding)可以承受）

5、正式开搞

1、先开通codepipeline

2、创建一个新项目，前端必备都是nodejs环境

3、这儿记得填写项目的ssh地址。就是git@....，证书一定要配置！

4、配置证书，选择ssh用户。填入你的私钥，注意不是公钥。

如果是阿里云code的项目，如图：存放你的公钥。

5、构建命令：比如我的vue项目。就是

npm install
npm run build

测试命令就要看自己项目的配置了

6、上传到oss上，vue默认的打包生成的目录都是dist，根据自己实际的填写就行了。这儿是打包成 xxx.gz的压缩包上传的

去oss上新建bucket，选择默认选项就行了。区域就用华北2就行了。

7、这里有大坑 (加红加粗)（如果需要不需要部署到ECS就直接跳过）

如果在ECS上执行了下面的代码（每个人的不一样，不要复制我的代码），但是可选部署目标里面刷新不出来。

export DEPLOYINDENTIFIER=9996e9f03039d1d121f5cb015e701d62 && wget -nv -O-  http://aliclouddeployclient.oss-cn-beijing.aliyuncs.com/alicloud_deployclient_installer.sh | bash（别复制，只是示例）

请含泪查看官方文档，是的，只支持两个地方的ECS服务器，其他的需要提工单。
然而我是遇到的是第一次出现了，第二次配置的刷新不出来了。属于官方文档的第二种情况
第二次配置的时候，同一个服务器不要在执行上面的代码 （加红加粗）！！！！

官方文档官方文档官方文档官方文档官方文档，真不好找。。

部署命令（加红加粗）！！！！

先解释下：部署命令会把构建物从oss上下载下来并且解压后才会执行。（文档上没有）
部署命令的执行环境是下面的工作空间指定的目录，构建物也是放在这个目录的。
官方的建议是：最佳实践是工作空间不要指定为代码部署的路径，而是单独的一个目录，然后在部署命令里面把解压出来的文件复制到代码部署的地方，然后清空这个单独的目录。

检查命令和回滚命令请自行玩耍，我目前是空着的。

8、依旧是大坑（如果你要使用触发器的话）

如图，框起来的部分，千万别动了。一定不要去改！！！（加红加粗）！！！！如果修改了，就会导致触发器的代码无效。

其实到这儿基本上就ok，如果你需要添加触发器的话，请继续往下读。不需要的话，也继续往下，因为你忘了给我点赞：)

8、添加触发器，强烈建议使用触发器，这样当你需要构建的时候，只需要push一次代码就自动构建了。

生成触发器请仔细阅读触发器文档，一定要注意步骤，最后才去点生成按钮。

特别提醒，一定不要修改源码管理的东西，别问我为什么，卡了两天才得出来的结论我会告诉你

9、部署成功后，目前可以发邮件和钉钉提示。这个很简单就不介绍了

其实部署成功后还可以有很多玩法，这个就需要自己去玩耍了。

后续遇到的坑：

如果发生构建失败，记得要删除当前构建，否则触发器不会工作