这是我参与「第五届青训营」伴学笔记创作活动的第 15 天

三、Github 知识

1. 使用 Actions CI 部署文档库

在自己的账号里申请一个新的 token，然后将其添加到仓库的 secret

实现功能：push 代码到 dev 分支就去自动构建文档库然后推送到 gh-pages 分支

1）申请 token

GitHub 个人头像 -> Setting -> Developer settings - Personal access tokens - Tokens(classic)，勾选 repo、workflow，创建 Token 并保存

名字随意见闻知意就行，勾选 workflow 权限

2）仓库创建 secret

仓库 Settings - Secrets and variables - Actions

3）配置 yml 脚本命令

在根目录创建 .github 文件夹，在创建 workflows 文件夹，下面放 gh-pages.yml 文件

 on: # 触发条件
   # 每当 push 到 dev 分支时触发部署
   push:
     branches: [dev]
   # 是否手动触发部署
   workflow_dispatch:
 jobs:
   site:
     runs-on: ubuntu-latest # 指定运行所需要的虚拟机环境（必填）
 
     steps:
       - uses: actions/checkout@v2
         with:
           # “最近更新时间” 等 git 日志相关信息，需要拉取全部提交记录
           fetch-depth: 0
           persist-credentials: false
           
       - name: Setup pnpm
         uses: pnpm/action-setup@v2
         with:
           # 选择要使用的 pnpm 版本
           version: 7
 
       - name: Setup node
         uses: actions/setup-node@v2
         with:
           node-version: 16.8.x
       
       - uses: actions/cache@v3
         name: Setup pnpm cache
         id: pnpm-cache
         with:
           path: |
             **/node_modules
           key: ${{ runner.os }}-pnpm-${{ hashFiles('**/pnpm-lock.yaml') }}
           restore-keys: |
             ${{ runner.os }}-pnpm-
 
       - name: Install dependencies
         if: steps.pnpm-cache.outputs.cache-hit != 'true'
         run: pnpm i --frozen-lockfile
 
       - name: Local build
         run: pnpm run docs:build
           
       # 查看 workflow 的文档来获取更多信息
       # @see https://github.com/crazy-max/ghaction-github-pages
       - name: Deploy to GitHub Pages
         uses: crazy-max/ghaction-github-pages@v2
         # 环境变量
         env:
           GITHUB_TOKEN: ${{ secrets.ACTION_SECRET }}
         with:
           # 部署到 gh-pages 分支
           target_branch: gh-pages
           # 部署目录为 VitePress 的默认输出目录
           build_dir: site/docs/.vitepress/dist

2. Github 和 Gitee 配置公钥

登录自己的 gitee 账号，打开如下地址：SSH公钥 - Gitee.com

个人设置 -> SSH 公钥 -> 怎样生成公钥：生成/添加SSH公钥 - Gitee.com

根据上面的内容做，注意：直接三次回车，不要输入密码，即可生成 ssh key。通过查看 ~/.ssh/id_ed25519.pub 文件内容，获取到你的 public key

现在的公钥地址：C:\Users\86156.ssh，86156 是用户名

只有将这公钥配置在自己的账号上面，才可以通过 ssh 去操作仓库或者 actions 操作仓库

四、npm 发包

1. 版本号

npm下载时版本号的问题（^1.0.0,~1.0.0）

 "devDependencies": {
     "@vue/cli-plugin-babel": "~4.5.0",
     "@vue/cli-plugin-router": "~4.5.0",
     "@vue/cli-plugin-vuex": "~4.5.0",
     "@vue/cli-service": "*",
     "less": "4.1.2",
     "less-loader": "^5.0.0",
     "vue-template-compiler": "^2.6.11"
   }

major：主版本号

minor：次版本号

patch：补丁，修复bug

假设jquery的版本号有：[1.0.0, 2.0.0, 2.0.1, 2.1.0, 2.1.1, 2.1.9， 2.4.2, 3.0.0]

jquery：* 表示最新版本号；项目npm下载时，会下载该插件最新版本,即3.0.0
表示锁定主版本号；例子：'jquery’:‘^2.0.0’,表示会默认下载版本号为2的插件，后面取最新，即会下载2.4.2
表示锁定主、次版本号；例子：'jquery’:‘~2.1.0’,表示会默认下载版本号为2.1的插件，后面取最新，即会下载2.1.9
例子：‘jquery’:'1.0.0';表示精确匹配该版本号，即会下载1.0.0的插件

2. 发布组织包

要想发布一些以 @hview-plus/xx 为开头的包，需要先注册私人组织，然后在发包的时候使用 npm publish --access publish

1）创建一个私人组织

找到自己的 npm 打开 - Account 设置，Organizations 添加一个组织

创建一个免费的组织

2）发布组织名下的包

一定要携带 --access public 这个后缀，才能发布到自己的组织名下

参考文献：npm publish 提示 You must sign up for private packages - 前端路迹 (qinshenxue.com)

组件库项目开发过程中学习到的知识点笔记 | 青训营笔记