您现在的位置是：网站首页 > 拒绝 CI/CD（“本地打包再上传就行”）文章详情

拒绝 CI/CD（“本地打包再上传就行”）

陈川【前端综合】 12022人已围观 2614字

拒绝 CI/CD（“本地打包再上传就行”）的代价

CI/CD（持续集成/持续部署）是现代前端工程的标准实践，但总有人坚持“本地打包再上传就行”的工作模式。这种看似简单的操作背后隐藏着巨大的技术债务和团队协作风险。

手工操作引发的版本灾难

手动打包上传最直接的问题是版本混乱。当多个开发者并行开发时，很容易出现版本覆盖：

# 典型的手工操作流程
npm run build
scp -r dist/* user@server:/path/to/prod

假设开发者A刚上传了v1.2.0，开发者B本地还是v1.1.0的代码，一次不经意的上传就会导致版本回退。更可怕的是这种问题往往要到用户反馈才能发现。

环境差异导致的“在我机器上能跑”

没有CI/CD意味着每台开发机的构建环境都可能不同。考虑以下场景：

// package.json
{
  "scripts": {
    "build": "webpack --mode=production"
  },
  "devDependencies": {
    "webpack": "^4.0.0" 
  }
}

开发者C的Node版本是14.x，开发者D用的是16.x，同样的npm install可能安装不同的小版本webpack，最终生成的bundle hash完全不同。这种隐蔽的环境问题可能让线上代码表现异常。

缺乏自动化测试的勇气

手工部署流程中，单元测试和E2E测试往往被忽略：

// 本该在CI中运行的测试
describe('Button组件', () => {
  it('点击时触发回调', () => {
    const mockFn = jest.fn()
    render(<Button onClick={mockFn} />)
    fireEvent.click(screen.getByRole('button'))
    expect(mockFn).toHaveBeenCalled()
  })
})

没有自动化测试保障，每次部署都像俄罗斯轮盘赌——可能这次没事，但下次就会触发未捕获的边界条件错误。

部署过程的黑箱操作

手工部署缺乏可追溯性。当线上出现问题时，你无法快速回答：

这次部署包含哪些代码变更？
是谁在什么时候执行的部署？
构建时的环境变量是什么？

对比CI/CD系统的完整日志记录，手工操作就像在黑暗中摸索。

回滚机制的缺失

当线上出现严重bug时，手工部署者常用的“解决方案”是：

git checkout HEAD~1
npm run build
scp -r dist/* user@server:/path/to/prod

这种回滚方式存在致命缺陷：

可能回滚到包含其他问题的历史版本
静态资源缓存会导致新旧版本资源混合
无法保证回滚后的数据库/API兼容性

团队协作的噩梦

在没有CI/CD的团队中，常听到这样的对话：

“你上传代码前怎么不跟我说一声？”
“我本地跑得好好的，怎么线上就挂了？”
“这次打包你改webpack配置了吗？”

这种协作模式让代码部署变成零和博弈，严重拖慢迭代速度。

安全风险的温床

手工部署往往需要直接的生产服务器访问权限。当开发者离职时：

SSH密钥可能还留在其电脑上
服务器密码可能通过聊天工具传播过
敏感的.env文件可能被意外打包上传

CI/CD系统通过RBAC（基于角色的访问控制）可以精确控制每个人的操作权限。

性能优化的阻碍

现代前端优化如代码分割、tree-shaking、缓存策略等都需要稳定的构建环境：

// webpack.config.js
output: {
  filename: '[name].[contenthash:8].js',
  chunkFilename: '[name].[contenthash:8].chunk.js'
}

手工部署时，开发者可能会因为“构建太慢”而禁用这些优化，或者因为hash不稳定导致缓存失效。

持续交付文化的缺失

拒绝CI/CD不仅是技术选择，更是团队文化的体现。这样的团队通常：

恐惧频繁部署，积累大量变更后“赌一把”
没有部署checklist，靠个人记忆
将部署视为“运维工作”而非开发环节

这种文化会导致迭代速度随着项目增长指数级下降。

基础设施即代码的逆行者

现代前端工程强调用代码管理基础设施：

# GitHub Actions示例
name: CI
on: [push]
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - run: npm ci
      - run: npm test
      - run: npm run build
      - uses: actions/upload-artifact@v2
        with:
          name: dist
          path: dist

手工部署团队却维护着口口相传的“部署秘籍.txt”，新成员需要踩过所有坑才能掌握部署流程。