Use @semantic to release package to NPM and publish docs to gh-pages automatically

https://www.notion.so/Use-semantic-to-release-package-to-NPM-and-publish-docs-to-gh-pages-automatically-9f1bdd8734874fcaa1ed9621c1867f9b

  1. Install requisite dependencies

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    
     # run local scripts for executing ts file for deploying docs
     npm i -D @types/node
     npm i -D ts-node
    	
     # semantic-release and plugin for attaching version number to package.json
     npm i -D semantic-release
     npm i -D @semantic-release/git
    	
     # git hooks and validate commit messages
     npm i -D husky
     npm i -D @commitlint/cli
    
  2. Add content to package.json

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    
     {
       "scripts": {
         "deploy-docs": "ts-node tools/gh-pages-publish.ts",
         "semantic-release": "semantic-release"
       },
       "files": [
         "dist"
       ],
       // if package scoped like @bndynet/ui, by default private, so...
       "publishConfig": {
         "access": "public"
       },
       "husky": {
         "hooks": {
           "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
         }
       }
     }
    
  3. New file .releaserc (Release Configurations)

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    
     {
       "branch": "master",
       "prepare": [
         "@semantic-release/npm",
         {
           "path": "@semantic-release/git",
           "assets": [
             "package.json",
             "package-lock.json"
           ],
           "message": "chore(release): ${nextRelease.version} by CI\n\n${nextRelease.notes}"
         }
       ],
       "plugins": [
         "@semantic-release/commit-analyzer",
         "@semantic-release/release-notes-generator",
         "@semantic-release/npm",
         "@semantic-release/github",
         "@semantic-release/git"
       ]
     }
    
  4. New file .travis.yml (CI configurations for publishing docs and releasing package)

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    
     language: node_js
     cache:
       directories:
         - ~/.npm
     notifications:
       email: false
     node_js:
       - '10'
     script:
       - npm run build
     after_success:
       - if [ "$TRAVIS_BRANCH" = "master" -a "$TRAVIS_PULL_REQUEST" = "false" ]; then npm run deploy-docs; fi
       - if [ "$TRAVIS_BRANCH" = "master" -a "$TRAVIS_PULL_REQUEST" = "false" ]; then npm run semantic-release; fi
     branches:
       except:
       - /^v\d+\.\d+\.\d+$/
    	
    
  5. New file tools/gh-pages-publish.ts (Scripts to upload docs to gh-pages branch)

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    
     import { cd, exec, echo, touch } from "shelljs";
     import { readFileSync } from "fs";
     import { parse } from "url";
    	
     let repoUrl
     let pkg = JSON.parse(readFileSync("package.json"))
     if (typeof pkg.repository === "object") {
       if (!pkg.repository.hasOwnProperty("url")) {
         throw new Error("URL does not exist in repository section")
       }
       repoUrl = pkg.repository.url
     } else {
       repoUrl = pkg.repository
     }
    	
     let parsedUrl = parse(repoUrl)
     let repository = (parsedUrl.host || "") + (parsedUrl.path || "")
     let ghToken = process.env.GH_TOKEN
    	
     echo("Deploying docs!!!")
     cd("docs")
     touch(".nojekyll")
     exec("git init")
     exec("git add .")
     exec('git config user.name "Bendy Zhang"')
     exec('git config user.email "zb@bndy.net"')
     exec('git commit -m "docs(docs): update gh-pages"')
     exec(
     `git push --force --quiet "https://${ghToken}@${repository}" master:gh-pages`
     )
     echo("Docs deployed!!")
    
  6. Add environment variables to CI (Travis CI)

    • GH_TOKEN or GITHUB_TOKEN: your token generated in GitHub and has repo scopes
    • NPM_TOKEN: your token generated in NPM
This post is licensed under CC BY 4.0 by the author.