Travis-CI自动化测试,轻松部署到CentOS服务器
2024-01-05 17:48:15
- 前期准备
1.1 创建Git仓库
在开始之前,我们需要创建一个Git仓库来托管我们的前端工程代码。您可以使用Github或GitLab来创建您的仓库,本教程中我们将使用Github。
1.2 创建SSH Key
我们需要创建一个SSH密钥来连接到我们的部署服务器。SSH密钥是用来加密和解密通信的,可以帮助我们安全地访问远程服务器。
1.3 安装Travis-CI
Travis-CI是一款流行的持续集成和持续部署工具,可以帮助我们自动构建、测试和部署我们的代码。我们可以通过以下命令来安装Travis-CI:
gem install travis
1.4 创建Travis-CI配置文件
Travis-CI配置文件(.travis.yml)用于定义我们的测试和部署脚本。我们将使用以下内容作为我们的Travis-CI配置文件:
language: node_js
node_js:
- "12"
script:
- npm run test
deploy:
provider: script
script: npm run deploy
on:
branch: master
2. 自动化测试
2.1 安装测试框架
我们需要安装一个测试框架来对我们的前端工程进行测试。我们可以使用以下命令来安装Jest:
npm install --save-dev jest
2.2 编写测试脚本
我们需要编写测试脚本来测试我们的前端工程。我们可以使用以下代码作为我们的测试脚本:
describe("MyComponent", () => {
it("should render correctly", () => {
const wrapper = shallow(<MyComponent />);
expect(wrapper).toMatchSnapshot();
});
});
2.3 运行测试
我们可以使用以下命令来运行测试:
npm run test
3. 部署到CentOS服务器
3.1 准备部署服务器
我们需要准备一台CentOS服务器来部署我们的前端工程。我们可以使用阿里云、腾讯云或其他云服务提供商来租用服务器。
3.2 安装Nginx
我们需要在我们的服务器上安装Nginx来作为我们的Web服务器。我们可以使用以下命令来安装Nginx:
yum install nginx
3.3 安装Node.js和Vue.js
我们需要在我们的服务器上安装Node.js和Vue.js。我们可以使用以下命令来安装Node.js和Vue.js:
curl -sL https://rpm.nodesource.com/setup_12.x | bash -
yum install nodejs
npm install -g @vue/cli
3.4 部署前端工程
我们可以使用以下命令来部署我们的前端工程到服务器:
npm run build
scp -r build/* root@<your_server_ip>:/var/www/html/
3.5 访问前端工程
我们可以通过以下URL来访问我们的前端工程:
http://<your_server_ip>/
4. 总结
通过本教程,我们学习了如何使用Travis-CI来自动化测试并部署我们的前端工程到CentOS服务器。我们使用了Vue脚手架来构建我们的单页应用,并使用了Github来托管我们的项目。我们使用了SSH密钥来连接到我们的部署服务器,并使用了Travis-CI配置文件(.travis.yml)来定义我们的测试和部署脚本。我们还学习了如何安装和配置Nginx来作为我们的Web服务器。最后,我们学习了如何部署我们的前端工程到服务器并访问它。