vercel

文档

vercel 可以用 vc 来代替，vc 是 Vercel 的缩写

安装

pnpm i -g vercel
yarn global add vercel
npm i vercel -g

vercel login #登录 Vercel 账号
vercel dev #开启本地调试服务
vercel #部署本地资源到 Vercel 上
vercel --prod #更新本地到 Vercel 上

nodejs项目 跨域配置

yarn add @vercel/node -D

vercel.json

{
  "builds": [
    {
      "src": "./index.js",
      "use": "@vercel/node"
    }
  ],
  "routes": [
    {
      "src": "/(.*)",
      "dest": "/",
      "headers": {
        "Access-Control-Allow-Credentials": "true",
        "Access-Control-Allow-Origin": "*",
        "Access-Control-Allow-Methods": "GET,OPTIONS,PATCH,DELETE,POST,PUT",
        "Access-Control-Allow-Headers": "X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version"
      }
    }
  ]
}

vercel 部署vue项目

1. 使用vue-cli创建的v2、v3项目，build打包项目后，进入dist 使用vc --prod部署

2. 使用vite创建的项目，配置为下面，直接vc部署

  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  }

3. 部署vue项目刷新路由后404问题

vercel.json

{
  "rewrites": [{ "source": "/:path*", "destination": "/index.html" }]
}

其他命令

# 查看项目列表
vercel project ls

#添加项目
vercel project add

#删除项目
vercel project rm

#从云端获取最新的“开发”环境变量和项目设置
vercel pull

# 使用vercel pull从云端获取最新的“预览”环境变量和项目设置
vercel pull --environment=preview

#使用vercel pull从云端获取最新的“生产”环境变量和项目设置
vercel pull --environment=production
·
# 查看日志
vercel logs [deployment-url]

# 监控日志
vercel logs --follow deployment-url

#重新部署
vercel redeploy [deployment-id or url]
vercel redeploy https://example-app-6vd6bhoqt.vercel.app > deployment-url.txt

#删除部署
vercel remove [deployment-url]
#删除多个部署
vercel remove [deployment-url-1 deployment-url-2]

#根据项目名称安全的删除
vercel remove my-project --safe

#将生产部署回滚到以前的部署
vercel rollback [deployment-id or url]

一键部署

#!/usr/bin/env sh

# 确保脚本抛出遇到的错误
set -e

# 生成静态文件
pnpm run build

# 进入生成的文件夹
cd dist

# 设置expect永不超时
set timeout -1

# 设置expect 30秒超时，如果超过30没有expect内容出现，则推出
# set timeout 300

# 使用expect实现自动应答
/usr/bin/expect<<-EOF
 # 在该语句开始执行后，expect开始捕获终端的输出信息，然后做出对应的操作
spawn vc --prod

expect "Set up and deploy" 
send "Y\n"

expect "Which scope do you want to deploy to" 
send "enter\n" 

expect "Link to existing project" 
send "Y\n" 

expect "What’s the name of your existing project" 
send "threejs\n" 

expect "In which directory is your" 
send "enter\n"

expect "Production:" 

expect EOF