mobile wallpaper 1mobile wallpaper 2mobile wallpaper 3mobile wallpaper 4
60 words
1 minute
Automatically Deploy an Angular Page with GitHub Actions

angular.json#

 projects > {your-project-name} > architect > build > options > outputPath

If the generated static website is under browser by default, remember to modify or add this property:

"baseHref": "/browser/",

Install angular-cli-ghpages:

ng add angular-cli-ghpages

Create a workflow under .github/workflows#

name: Deploy to GitHub Pages
on:
push:
branches:
- master # 或者你要监控的分支名称
jobs:
build-and-deploy:
runs-on: ubuntu-latest
steps:
- name: Checkout code
uses: actions/checkout@v3
- name: Setup Node.js
uses: actions/setup-node@v3
with:
node-version: '20' # 请根据项目需求修改 Node.js 版本
- name: Install dependencies
run: npm install
- name: Build project
run: npm run build
- name: Deploy to GitHub Pages
uses: JamesIves/github-pages-deploy-action@v4
with:
folder: dist/my-angular-project/browser # 请根据实际输出路径填写
token: ${{ secrets.TOKEN }}
env:
GITHUB_TOKEN: ${{ secrets.TOKEN }}

Remember to generate a token on GitHub for repository access and add it to the Action’s environment variables.

https://github.com/${your_name}/${your_repo}/settings/secrets/actions

Push to the monitored branch#

Update the GitHub Pages configuration and set the Pages branch to gh-pages.

Share

If this article helped you, please share it with others!

Automatically Deploy an Angular Page with GitHub Actions
https://dreaife.tokyo/en/posts/github-action-angular/
Author
dreaife
Published at
2024-11-04
License
CC BY-NC-SA 4.0

Some information may be outdated

Table of Contents