Vercel的构建和普通的github actions在Nodejs项目中有啥区别

发布于 1周前 作者 nodeper 来自 nodejs/Nestjs

一个 astro 项目。

vercel 构建大概 ~40s 左右。

使用 azure static_web_apps 默认的流程，描述如下，要 ~3m30s 左右。

name: Azure Static Web Apps CI/CD

on:
push:
branches:
- main
pull_request:
types: [opened, synchronize, reopened, closed]
branches:
- main


jobs:
build_and_deploy_job:
if: github.event_name == ‘push’ || (github.event_name == ‘pull_request’ && github.event.action != ‘closed’)
runs-on: ubuntu-latest
name: Build and Deploy Job
steps:
- uses: actions/checkout@v4
with:
submodules: true
lfs: false
- name: Build And Deploy
id: builddeploy
uses: Azure/static-web-apps-deploy@v1
with:
azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments)
action: “upload”
###### Repository/Build Configurations - These values can be configured to match your app requirements. ######
# For more information regarding Static Web App workflow configurations, please visit: https://aka.ms/swaworkflowconfig
app_location: “/” # App source code path
api_location: “” # Api source code path - optional
output_location: “dist” # Built app content directory - optional


      ###### End of Repository/Build Configurations ######

close_pull_request_job:
if: github.event_name == ‘pull_request’ && github.event.action == ‘closed’
runs-on: ubuntu-latest
name: Close Pull Request Job
steps:
- name: Close Pull Request
id: closepullrequest
uses: Azure/static-web-apps-deploy@v1
with:
azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
action: “close”

大概看了一下，好像 azure static_web_apps 这个流程需要从准备 node 环境的 docker 开始，vercel 直接拉下来代码，就可以开始构建了，使用后者的话，有啥可以优化的地方不？


Vercel的构建和普通的github actions在Nodejs项目中有啥区别

Harmonyos Next教程
2 回复

github actions 可以缓存依赖


Vercel的构建与普通的GitHub Actions在Node.js项目中的区别主要体现在以下几个方面：

Vercel构建

  1. 自动化与便捷性：

    • Vercel支持直接导入GitHub仓库，自动根据仓库依赖生成构建命令，简化配置流程。
    • 自动支持HTTPS，无需手动配置证书。
    • 支持serverless接口部署，适用于动态和静态网站。

  2. 速度与性能：

    • Vercel在构建部署和访问速度上通常优于GitHub Pages。
    • 底层优化和全球CDN加速，提升用户体验。

GitHub Actions

  1. 灵活性：

    • GitHub Actions允许运行自定义命令，如npm/yarn脚本，提供更高的灵活性。
    • 可以集成第三方服务，实现复杂的工作流。

  2. 集成与扩展：

    • 通过Octokit SDK等现代JavaScript库，与GitHub API深度集成。
    • 支持事件驱动的工作流，根据GitHub事件触发特定的Actions。

示例代码

在GitHub Actions中部署到Vercel的示例代码片段可能如下：

name: Deploy to Vercel
on: [push]
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v3
    - name: Deploy to Vercel
      uses: vercel-action@0.14.0
      with:
        vercel-token: ${{ secrets.VERCEL_TOKEN }}
        github-token: ${{ secrets.GITHUB_TOKEN }}
        repo-token: ${{ secrets.GITHUB_TOKEN }} # If deploying from a monorepo

综上所述，Vercel和GitHub Actions各有优势，选择哪种方式取决于项目的具体需求和开发者的偏好。

回到顶部