一套真实前端开发环境搭建+可持续集成+自动化部署实践(第一篇环境搭建配置)

1,815 阅读4分钟

之前公司的流程是 gitlab + jenkins + nginx(大概是这样其他更细的因为没有机会涉及所以...略),大概的流程是就是代码提交到gitlab再通过jenkins打包部署到服务器,这个时候的效果就是你代码提交的了。暗暗觉得这是一个很 nice 的过程,相对人肉打包,再放到服务器是一个很舒服的过程。所以也一直希望有机会可以自己实践一番。

汇总

  • 服务器安装 Java SDK;
  • 服务器安装 nginx + 启动;
  • 服务器运行启动jenkins;

如果上述的环境你都已经具备的了那么你可以直接跳过这里,查看 一套真实前端开发环境搭建+可持续集成+自动化部署实践(第二篇 jenkins关联 GitHub自动打包部署)

需要的环境成本

  • 购买阿里云ECS(验证实践,我选择的是阿里的玩转校园生态 ,只要9.5元一个月)
  • 注册的GitHub(这里使用 GitHub 代替 gitlab )

提示:

1️⃣如下服务器安装软件,尽可能的使用yum(可以理解为类似 npm 的工具)安装,省去配置环境变量等的繁琐步骤;

2️⃣ssh 终端链接服务器长时间不操作,会断开链接,重登即可;

如下是具体详细的操作 ⏬⏬⏬⏬

①服务器操作步骤,安装 Java SDK;

  • 登录服务器进入 控制台--> 轻量级服务器

  • 首次到服务器修改一下远程连接密码

  • 修改完成之后,使用终端ssh 登录, ssh root@47.107.253.162(@后面是你的服务器的 ip),登录成功后,cd 进入根目录,查看是否有java 环境-java -version(用查看版本的方式),

安装 java sdk

如果没有输出信息,则没有安装。
如果安装了,首先卸载 

批量卸载
rpm -qa | grep java | xargs rpm -e --nodeps
yum -y remove java-1.8.0-openjdk-headless-1.8.0.65-3.b17.el7.x86_64

检索yum中有没有java1.8的包
yum list java-1.8*  

开始安装
yum install java-1.8.0-openjdk* -y

安装完成查看版本,查看jdk版本,java-1.8.0后台大佬说比较稳,so...
java -version

②服务器操作步骤,安装 nginx;

// rpm 安装nginx

rpm -Uvh http://nginx.org/packages/centos/7/noarch/RPMS/nginx-release-centos-7-0.el7.ngx.noarch.rpm

sudo yum install -y nginx

//------运行👆上面两句,算是安装成功了,一些文件夹位置和操作如下👇-------

Nginx启动
nginx -c nginx.conf

//查询出nginx的pid 
ps -ef|grep nginx

//通过kill 命令杀死 nginx 
kill pid


网站文件存放默认目录
/usr/share/nginx/html

网站默认站点配置
/etc/nginx/conf.d/default.conf

自定义Nginx站点配置文件存放目录
/etc/nginx/conf.d/

Nginx全局配置
/etc/nginx/nginx.conf

重启即可:nginx -s reload

基于nginx的静态部署:
server {
    listen 80;
    server_name _;
    root /usr/share/nginx/html;
    index Home.html;
}

安装完毕之后,以默认配置项启动nginx,验证成功与否网页打开你的服务器 ip 即可(ssh root@47.107.253.162,@后面的数字就是你服务器的 ip)

这样算是安装成功并且启动成功了👇

③服务器操作步骤,安装、启动jenkins

官网下载,选择.war包

把下载的 jenkins.war包上传到你的服务器,这里的上传工具 mac 推荐filezilla,windows 推荐 WinSCP,这里我使用的是filezilla,登录方式如下图,

登录成功后,在/user/jenkins 新建jenkins文件把我们下载的jenkins.war拖到这个文件夹中完成上传

filezilla登录你的服务器可能需要开启一下端口,这里是22,默认应该是开启的,如果没有开始你就手动开启一下;

终端登录,找到刚才我们新建,并且上传 jenkins.war 的文件夹。注意 !!!注意 !!! 注意 !!!,这里我们需要以后台挂起的方式运行,终端输入nohup java -jar jenkins.war --httpPort=8080 (后台以8080启动运行),

服务器运行 jenkins.war之后,浏览器输入http://47.107.253.162:8080(你的ip+启动端口)一切正常的话,浏览器打开会出现如下界面

👆上界面提示我们需要一个默认初始化密码,按照提示的文件夹我们可以找到这个密码复制出来

1.在终端上 vim 编辑 copy 出来

2在 filezilla或者 WinSCP中拖到你的电脑桌面用编辑机打开

输入 我们在/root/.jenkins/secrets/initialAdminPassword 中找到的密码,初始化我们的账号

这里我们选择推荐通用插件安装即可,选择后等待完成插件安装以及初始化

创建你的账号,并且记住你的账号,然后一路 next 到底就好了

最后如果都完成了,还是无法刷新出 jenkins系统界面的话可以尝试如下,浏览器中输入即可

1.关闭Jenkins服务
* http://47.107.253.162:8080/exit 
2.重启Jenkies服务
* http://47.107.253.162:8080/restart 
3.重新加载配置信息
* http://47.107.253.162:8080/reload 

最后登录成功之后的界面

由于文章较长,为了友好的阅读体验,第一篇先是介绍服务器需要的配置和软件的安装,下一篇会介绍 Jenkins关联 GitHub,实现GitHub push代码之后自动打包构建项目代码到服务器。

鸣谢~ 都看到这里了,点个赞呗~