使用CODING的[云原生构建]把vite+vue3打包的dist上传到制品库

我恨蚊子
328 阅读2分钟

因为众所周知的原因，没用github，用coding，突然发现个挺好用的功能，研究了下。
中间遇到不少问题，但是网上资料很少，自己摸索解决了，毕竟不是专业运维，弄得挺坎坷，分享给同样踩坑的朋友吧。
希望专业的大佬能给些指点，这个.coding-ci.yml怎么能更优化些。

image.png

就是这个东西

1. 新建yml文件

点云原生构建的新建就会自动创建.coding-ci.yml，里面会有默认的代码，提交上去就行了。

2. 选择node版本

我用的pnpm，肯定是18之上的，按需自己选。
我是push到release分支后触发这个ci的，也可以改成master，dev什么的。

release:
  push:
    - docker:
        image: node:20

3. 配置pnpm

我习惯用pnpm，习惯用npm的就更简单了

        - name: 安装Pnpm
          script: npm i pnpm -g

image.png

image.png

image.png

经过Jeff_web帮助，改成下面的能快一些（按照大多数框架说法提速了7倍😂）

        - name: 激活corepack
          script: corepack enable

4. 安装依赖然后打包

这没什么说的，按照自己项目的来就行。

        - name: 安装依赖
          script: pnpm i --frozen-lockfile
        - name: 打包项目
          script: pnpm build

--frozen-lockfile不生成lockfile,pnpm官网有详细说明，不清楚的可自己看看。

If true, pnpm doesn't generate a lockfile and fails to install if the lockfile is out of sync with the manifest / an update is needed or no lockfile is present.

5. 获取package.json的version，并设置为环境变量

这里我不会写，shell不熟，ai生成的自己再改改弄的，有没有简单的方法啊，大手子们？

        - name: 获取package.json的version，并设置为环境变量
          script: 
            - current_version=$(npm pkg get version)
            - current_version="${current_version%\"}"
            - current_version="${current_version#\"}"
            - echo $current_version
          exports:
            info: PACKAGE_VERSION

6. tar压缩

简单压缩包，方便上传下载

        - name: tar压缩
          script: tar -zcvf dist.tar.gz dist

7. 新建制品库

image.png
这里新建

7.1 获取权限

image.png

image.png

7.2 使用curl

image.png

8. 上传制品库

        - name: 上传到制品库
          script: curl -T dist.tar.gz -u [username:userpassword] "[url]/dist.tar.gz?version=${PACKAGE_VERSION}"

注意以下几点：

  1. username:userpassword是你自己的制品库生成的东西
  2. url也是制品库的
  3. PACKAGE_VERSION就是上面的变量了，你也可以自己随便定

9. .coding-ci.yml完整代码

好了，这就完成了，下面是完整代码：

release:
  push:
    - docker:
        image: node:20
      stages:
        - name: 激活corepack
          script: corepack enable
        - name: 安装依赖
          script: pnpm i
        - name: 打包项目
          script: pnpm build          
        - name: tar压缩
          script: tar -zcvf dist.tar.gz dist
        - name: 获取package.json的version
          script: 
            - current_version=$(npm pkg get version)
            - current_version="${current_version%\"}"
            - current_version="${current_version#\"}"
            - echo $current_version
          exports:
            info: PACKAGE_VERSION
        - name: 上传到制品库
          script: curl -T dist.tar.gz -u [username:userpassword] "[url]/dist.tar.gz?version=${PACKAGE_VERSION}"

pnpm缓存依赖吧，试了几个方法都不理想，和没有设置缓存构建时间没什么大区别，希望有人能评论区指导下~

avatar
文章
阅读
粉丝