GitHub Actions support

I’ve been trying to implement the ability for my application to be deployed for every new commit.

Although the command reports that my application was successfully deployed to the gh-pages branch, I don’t see any new changes on the branch apart from the build I manually deployed about 9 days ago.

You can view the project here for your reference: https://github.com/EdricChan03/rss-reader

I’m using the ng deploy command and I’ve verified that I’ve updated my Angular app’s dependencies to the appropriate versions (e.g. upgrading Angular CLI to v8.3.0 which supports deploy builders). I’ve also verified that I can deploy my app via the command line locally.

A method that one had suggested before was to append the x-access-token to the GitHub token, but that still didn’t work.

Here’s my project’s dependencies:

  "dependencies": {
    "@angular/animations": "^8.2.3",
    "@angular/cdk": "^8.0.1",
    "@angular/common": "^8.2.3",
    "@angular/compiler": "^8.2.3",
    "@angular/core": "^8.2.3",
    "@angular/fire": "^5.2.1",
    "@angular/flex-layout": "^8.0.0-beta.26",
    "@angular/forms": "^8.2.3",
    "@angular/material": "^8.0.1",
    "@angular/platform-browser": "^8.2.3",
    "@angular/platform-browser-dynamic": "^8.2.3",
    "@angular/router": "^8.2.3",
    "@angular/service-worker": "^8.2.3",
    "@types/highlight.js": "^9.12.3",
    "angular-cli-ghpages": "^0.6.0-rc.2",
    "core-js": "^2.6.3",
    "firebase": "^6.2.2",
    "hammerjs": "^2.0.8",
    "highlight.js": "^9.13.1",
    "markdown-to-html": "0.0.13",
    "ngx-markdown": "^8.1.0",
    "rxjs": "^6.5.2",
    "tslib": "^1.10.0",
    "web-animations-js": "^2.3.2",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.802.2",
    "@angular/cli": "^8.3.0",
    "@angular/compiler-cli": "^8.2.3",
    "@types/gulp": "^4.0.6",
    "@types/gulp-rename": "0.0.33",
    "@types/hammerjs": "^2.0.36",
    "@types/jasmine": "^2.8.16",
    "@types/node": "^10.14.16",
    "codelyzer": "^5.0.1",
    "copy-webpack-plugin": "^4.6.0",
    "gulp": "^4.0.2",
    "gulp-markdown": "^3.0.0",
    "gulp-rename": "^1.4.0",
    "gulp-transform": "^3.0.5",
    "jasmine-core": "~3.1.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^4.2.0",
    "karma-chrome-launcher": "^2.0.0",
    "karma-cli": "^2.0.0",
    "karma-coverage-istanbul-reporter": "^1.4.3",
    "karma-jasmine": "^1.1.2",
    "karma-jasmine-html-reporter": "^1.4.2",
    "karma-remap-istanbul": "^0.6.0",
    "node-sass": "^4.12.0",
    "protractor": "^5.4.2",
    "ts-node": "^8.3.0",
    "tsconfig-paths": "^3.8.0",
    "tslint": "~5.10.0",
    "typescript": "^3.5.3"
  }

And the relevant GitHub Action workflow (available at .github/workflows/main.yml in my project):

name: Site workflow


on:
  push:
    branches:
    # Only accept deploying from the master branch
    - master


jobs:
  deploy:
    name: Deploy to GitHub Pages
    runs-on: ubuntu-latest
    
    steps:
    - uses: actions/checkout@v1
    - name: Setup NodeJS LTS
      uses: actions/setup-node@v1
      with:
        node-version: '10.x'
    - name: Install dependencies
      run: npm ci
    - name: Generate documentation
      run: npm run genDocs
    - name: Deploy site
      run: npm run action:deploy
      env:
        GH_TOKEN: ${{ secrets.DEPLOY_GH_PAGES_TOKEN }}

Note: I’ve also ensured that the DEPLOY_GH_PAGES_TOKEN I have specified in the Secrets tab of a repository has the repo permission group ticked.

EDIT: Here’s the output of ng version attached below:

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 8.3.0
Node: 10.15.3
OS: darwin x64
Angular: 8.2.3
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
... service-worker

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.802.2
@angular-devkit/build-angular     0.802.2
@angular-devkit/build-optimizer   0.802.2
@angular-devkit/build-webpack     0.802.2
@angular-devkit/core              8.2.2
@angular-devkit/schematics        8.3.0
@angular/cdk                      8.0.1
@angular/cli                      8.3.0
@angular/fire                     5.2.1
@angular/flex-layout              8.0.0-beta.26
@angular/material                 8.0.1
@ngtools/webpack                  8.2.2
@schematics/angular               8.3.0
@schematics/update                0.803.0
rxjs                              6.5.2
typescript                        3.5.3
webpack                           4.38.0

EDIT 2: Here’s the scripts defined in my package.json:

  "scripts": {
    "start": "ng serve",
    "lint": "tslint \"src/**/*.ts\"",
    "test": "ng test",
    "pree2e": "webdriver-manager update",
    "e2e": "protractor",
    "githubPages": "npm run genDocs && ng deploy --base-href=/rss-reader/ && rm -rf dist/",
    "githubPages2": "npm run build && ngh && rm -rf dist/",
    "genDocs": "gulp docs",
    "build": "ng build --prod --base-href /rss-reader/ --deploy-url /rss-reader/",
    "build-prod-local": "ng build -c=httpserver --prod && cd dist && http-server",
    "deploy": "ng deploy",
    "action:deploy": "ng deploy --repo https://x-access-token:[e-mail]/EdricChan03/rss-reader.git"
  },

EDIT 3: Here’s the default configuration I have supplied for the deploy builder (extracted):

{
  "projects": {
    "rss-reader": {
      "architect": {
        ...
        "deploy": {
          "builder": "angular-cli-ghpages:deploy",
          "options": {
            "baseHref": "/rss-reader/",
            "repo": "https://github.com/EdricChan03/rss-reader"
          }
        }
      }
    }
  }
}

---

P.S. If you haven’t heard of GitHub Actions yet, you can learn more about it here. I’m also in the beta which allows me to participate in such a beta feature.

[JohannesHoppe]

Hello friends. I realized that we have now a Checkout v2 action (https://github.com/actions/checkout/) and it looks like we might be able to ommit GH_TOKEN (personal access token) and use the GITHUB_TOKEN.

see https://github.com/actions/checkout/issues/75

Has anybody already used v2?

@shhdharmen @EdricChan03 @fmalcher

[JohannesHoppe]

@EdricChan03 I should try this out!