如何通过 Github Actions 实现Angular应用在GitHub Pages上的自动部署？

本文共计3561个文字，预计阅读时间需要15分钟。

前言：最近在学习Angular，一些基础的语法也基本掌握了。就在github上新建了一个代码仓库，准备用ng-zorro搭建一个后台应用模板，方便自己以后写一些小项目时可以直接使用。

前言

最近在学习 Angular，一些基础的语法也学习的差不多了，就在 github 上新建了一个代码仓库，准备用 ng-zorro 搭个后台应用的模板，方便自己以后写些小东西时可以直接使用。前端项目，最主要的还是能够实际看到，因此考虑找个地方部署，因为自己的博客是部署到 github page 上的，并且这个项目也只是一个静态网站，所以这里同样选择使用 github page

同时，考虑到发布项目时，虽然使用 github page 已经帮我们省略了拷贝文件到服务器上这一步，但是还是需要自己手动的敲命令来完成项目的发布，因为发布的流程很单一，所以这里选择通过 github action 这个自动化工具来实现程序的自动化部署

代码仓库地址：ingos-admin

预览地址：yuiter.com/ingos-admin

Step by Step

2.1、手动部署

示例的 Angular 应用，你可以通过 Angular CLI 直接生成，如有需要，可以点击此链接进行跳转查看（电梯直达），这里就不演示创建的过程了

按照正常的前端项目发布流程，当我们需要发布时，需要使用 npm 命令来完成项目的打包。