1.注冊(cè)npm賬號(hào)

打開(kāi)npm官網(wǎng)，并注冊(cè)自己的npm賬號(hào)

2.申請(qǐng)AccessToken

1.登錄npm官網(wǎng)，登錄成功后，點(diǎn)開(kāi)右上角頭像，并點(diǎn)擊Access Tokens選項(xiàng)

2.點(diǎn)開(kāi)Generate New Token下拉框，點(diǎn)擊Classic Token(和Granular Access Token有什么區(qū)別，請(qǐng)自行查驗(yàn)？)

3.填寫(xiě)token信息，選擇token類(lèi)型為Automation(可以避免2FA校驗(yàn))，保存申請(qǐng)的token信息(等下會(huì)用到)

3.github新建代碼倉(cāng)庫(kù)

在github上面創(chuàng)建新的空倉(cāng)庫(kù)

4.修改倉(cāng)庫(kù)設(shè)置

1.進(jìn)入新建的代碼倉(cāng)庫(kù)，點(diǎn)擊倉(cāng)庫(kù)tab選項(xiàng)卡的Settings

2.點(diǎn)開(kāi)Secrets and variables選項(xiàng)卡，點(diǎn)擊Actions選項(xiàng)，點(diǎn)擊對(duì)應(yīng)頁(yè)面的New repository secret按鈕

3.新建名稱(chēng)為NPM_TOKEN的secret, 并將剛剛申請(qǐng)到的npm token(前面要你保存的token)填入secret字段

5.新增ci文件

在代碼根目錄新建.github/workflow/ci.yml文件，文件內(nèi)容如下

name: CI
on:
  push:
    branches:
	  # 觸發(fā)ci/cd的代碼分支
      - master
jobs:
  build:
    # 指定操作系統(tǒng)
    runs-on: ubuntu-latest
    steps:
      # 將代碼拉到虛擬機(jī)
      - name: Checkout repository
        uses: actions/checkout@v2
      # 指定node版本
      - name: Use Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '16.x'
          registry-url: 'https://registry.npmjs.org'
      # 依賴(lài)緩存策略
      - name: Cache
        id: cache-dependencies
        uses: actions/cache@v3
        with:
          path: |
            **/node_modules
          key: ${{runner.OS}}-${{hashFiles('**/pnpm-lock.yaml')}}
      # 安裝pnpm
      - name: Install pnpm
        run: npm install -g pnpm@7.5.0
      # 依賴(lài)下載
      - name: Installing Dependencies
        if: steps.cache-dependencies.outputs.cache-hit != 'true'
        run: pnpm install
      # 打包
      - name: Running Build
        run: pnpm run build
      # 測(cè)試
      - name: Running Test
        run: pnpm run test-unit
      # 發(fā)布
      - name: Running Publish
        run: npm publish
        env:
          # NPM_TOKEN is access token
         NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

npm代碼如下

name: CI
on:
  push:
    branches:
      # 觸發(fā)ci/cd的代碼分支
      - master
jobs:
  build:
    # 指定操作系統(tǒng)
    runs-on: ubuntu-latest
    steps:
      # 將代碼拉到虛擬機(jī)
      - name: Checkout repository
        uses: actions/checkout@v2
      # 指定node版本
      - name: Use Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '16.x'
          registry-url: 'https://registry.npmjs.org'
      # 依賴(lài)緩存策略
      - name: Cache
        id: cache-dependencies
        uses: actions/cache@v3
        with:
          path: |
            **/node_modules
          key: ${{runner.OS}}-${{hashFiles('**/package-lock.json')}}
      # 依賴(lài)下載
      - name: Installing Dependencies
        if: steps.cache-dependencies.outputs.cache-hit != 'true'
        run: npm install
      # 打包
      - name: Running Build
        run: npm run build
      # 測(cè)試
      - name: Running Test
        run: npm run test-unit
      # 發(fā)布
      - name: Running Publish
        run: npm publish
        env:
          # NPM_TOKEN is access token
         NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

6.推送代碼至github

在代碼目錄初始化git，并將代碼推送到剛剛github上面新建的代碼倉(cāng)庫(kù)master分支，會(huì)自動(dòng)觸發(fā)ci/cd進(jìn)行自動(dòng)化發(fā)包文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-752491.html

到了這里，關(guān)于超簡(jiǎn)單：github-action自動(dòng)化發(fā)布npm包小記的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！