返回

利用水管小机建构Gitlab CI 前端部署

前端

前端应用的开发与部署，需要一个高效、稳定、自动化的工具链，Gitlab CI正是这样一个工具。Gitlab CI是一套用于构建、测试和部署代码的持续集成工具，可与Gitlab代码仓库无缝集成，并支持多种编程语言和构建工具。

前期准备

在开始搭建之前，您需要准备以下内容：

  • Gitlab账号：如果您尚未注册Gitlab，请访问Gitlab官网注册一个账户。
  • Gitlab仓库：您需要在Gitlab中创建一个代码仓库，用于存放您的前端项目代码。
  • 腾讯云账号：如果您尚未注册腾讯云，请访问腾讯云官网注册一个账户。
  • 水管小机：在腾讯云控制台中，创建一台水管小机实例，并确保已安装好所需的软件和配置。

搭建Gitlab CI

1. 启用Gitlab CI

登录您的Gitlab账号，进入您的项目仓库，在项目设置页面的"CI/CD"选项卡中，启用Gitlab CI。

2. 创建Gitlab CI配置文件

在您的项目根目录下，创建一个名为".gitlab-ci.yml"的文件，并添加以下配置：

image: node:latest

stages:
  - build
  - deploy

build:
  stage: build
  script:
    - npm install
    - npm run build

deploy:
  stage: deploy
  script:
    - scp -r ./dist/ user@yourdomain.com:/var/www/html

3. 配置腾讯云水管小机

登录您的腾讯云控制台，进入水管小机实例的控制台，在"安全组"页面，添加一条入站规则，允许来自Gitlab的IP地址访问SSH端口（通常是22端口）。

在"远程连接"页面，获取水管小机的IP地址和SSH端口号。

4. 配置SSH密钥

在您的本地计算机上，生成SSH密钥对：

ssh-keygen -t rsa -b 4096 -C "your_email@example.com"

将生成的公钥（~/.ssh/id_rsa.pub）复制到水管小机的"远程连接"页面中的"密钥对"中，并保存。

测试Gitlab CI

在您的项目根目录中，执行以下命令以启动Gitlab CI：

git push origin master

Gitlab CI将自动构建和部署您的项目。您可以在Gitlab的"CI/CD"页面中查看构建和部署的状态。

总结

通过以上步骤，您已经成功搭建好了Gitlab CI，并实现了前端项目的持续集成与部署。Gitlab CI的自动化和可定制性，可以大大提高您的工作效率和代码质量。