在GitLab中配置Vue项目gitlab-ci.yml遇多阶段问题求助

折腾50种配置还没搞定确实够闹心的，我结合你贴的配置和日常踩过的坑，给你梳理下可能的问题点和修复方案：

先贴下你目前用的配置方便对照：

build site:
  image: node:6
  stage: build
  script:
    - npm install --progress=false
    - npm run build
  artifacts:
    expire_in: 1 week
    paths:
      - dist
deploy:
  image: alpine
  stage: deploy
  script:
    - apk add --no-cache rsync openssh
    - mkdir -p ~/.ssh
    - echo "$S..."

一、Build阶段的核心问题：Node版本过于老旧 #

你用的node:6镜像已经是多年前的淘汰版本了，现在Vue.js 2.x最低要求Node 8.9以上，Vue 3更是要求Node 14.15+，老版本Node会导致：

• 依赖包安装失败（很多新包不再兼容Node 6）
• 构建时出现语法错误（比如ES6+语法不支持）

修复方案： #

• 更换为适配你项目的Node镜像，比如Vue 2用node:16，Vue 3用node:18，也可以参考项目package.json里的engines字段指定版本
• 优化构建脚本，用更适合CI环境的命令：

  build site:
    image: node:16
    stage: build
    cache:
      key: ${CI_COMMIT_REF_SLUG}
      paths:
        - node_modules/  # 缓存依赖，加速下次构建
    script:
      - npm config set registry https://registry.npmmirror.com  # 换国内源解决网络问题
      - npm ci  # 比npm install更稳定，严格按照package-lock.json安装
      - npm run build
    artifacts:
      expire_in: 1 week
      paths:
        - dist  # 确认下这里是项目实际的构建输出目录，看vue.config.js的outputDir
  

二、Deploy阶段的常见坑点（从你未写完的脚本来看） #

1. SSH密钥配置不完整 #

你脚本里的echo "$S..."应该是没写完的SSH_PRIVATE_KEY变量，这里容易踩的坑：

• 没有在GitLab项目的Settings > CI/CD > Variables里正确配置SSH_PRIVATE_KEY，要确保是完整的私钥内容（包括开头的-----BEGIN RSA PRIVATE KEY-----和结尾的-----END RSA PRIVATE KEY-----）
• 没有设置正确的文件权限，SSH会拒绝使用权限过宽的密钥
• 没有添加服务器到已知主机列表，导致首次连接时卡住

修复后的Deploy脚本示例： #

deploy:
  image: alpine
  stage: deploy
  only:
    - main  # 只在主分支触发部署
  script:
    - apk add --no-cache rsync openssh-client
    - mkdir -p ~/.ssh
    - echo "$SSH_PRIVATE_KEY" > ~/.ssh/id_rsa
    - chmod 600 ~/.ssh/id_rsa  # 必须设置600权限，否则SSH报错
    - ssh-keyscan -H 你的服务器IP或域名 >> ~/.ssh/known_hosts  # 避免首次连接的确认提示
    - rsync -avz --delete dist/ 你的服务器用户名@服务器IP:/部署目录路径  # 同步dist目录到服务器

2. Alpine镜像的SSH兼容性问题 #

如果你的服务器用的是较新的SSH版本，可能会出现密钥算法不兼容的情况，可以在SSH命令里添加兼容参数：

ssh -o HostKeyAlgorithms=+ssh-rsa -o PubkeyAcceptedKeyTypes=+ssh-rsa 你的服务器用户名@服务器IP

三、通用优化建议 #

• 给流水线添加阶段依赖，确保只有Build成功后才会触发Deploy：

  deploy:
    needs: ["build site"]  # 明确依赖Build阶段
    # 其他配置...
  

• 启用流水线的错误日志查看：每次失败后，去GitLab的CI/CD > Pipelines里点击对应流水线的失败步骤，查看具体报错信息，比如是依赖安装失败、构建报错还是SSH连接超时，针对性解决比盲目试配置高效太多

内容的提问来源于stack exchange，提问作者Tony