前端自动化构建

116 阅读3分钟
  • 简述

    随着前端项目的工程化,编译以及线上发布变得繁琐,因此前端工程自动化变得尤为重要,本次分享选择了目前比较流行的前端工程自动化解决方案Docker + Jenkins( CI & CD ) + git来做例子展示

Docker

  • 概念
Docker 属于 Linux 容器的一种封装,提供简单易用的容器使用接口。它是目前最流行的 Linux 容器解决方案。

Docker 将应用程序与该程序的依赖,打包在一个文件里面。运行这个文件,就会生成一个虚拟容器。程序在这个虚拟容器里运行,就好像在真实的物理机上运行一样。有了 Docker,就不用担心环境问题。

总体来说,Docker 的接口相当简单,用户可以方便地创建和使用容器,把自己的应用放入容器。容器还可以进行版本管理、复制、分享、修改,就像管理普通的代码一样。
1、对进程进行隔离
2、启动快
3、资源占用少
4、体积小
5、提供一次性的环境
6、提供弹性的云服务
7、组建微服务架构
  • 技术要点

1、docker 仓库: hub.docker.com/

docker也有自己的仓库,开发这可以在docker仓库中存储自己的镜像,使用方法类似git,可用pull命令下载仓库上的镜像:docker pull 容器名

2、docker image

查看本地已下载或已创建的镜像资源

3、docker run

运行镜像,例如:
docker run --name mynginx -p 80:80 -v /home:/usr/share/nginx/html -d nginx

4、docker ps

查看正在运行的镜像进程
docker ps -A :查看失败运行或已停止的镜像进程

5、docker exec -it 进程id /bin/bash

进入正在运行的容器内部
  • dockerfile : 配置 image

FROM node:alpine

WORKDIR /app
COPY . .

# If you have native dependencies, you'll need extra tools
# RUN apk add --no-cache make gcc g++ python

RUN npm install

EXPOSE 3001
CMD ["npm", "run", "start"]

ps: 

Alpine Linux Docker 镜像基于Alpine Linux 操作系统,后者是一个面向安全的轻型 Linux 发行版。不同于通常 Linux 发行版,Alpine Linux 采用了musl libc和busybox以减小系统的体积和运行时资源消耗

1、小巧:基于Musl libc和busybox,和busybox一样小巧,最小的Docker镜像只有5MB;

2、安全:面向安全的轻量发行版;

3、简单:提供APK包管理工具,软件的搜索、安装、删除、升级都非常方便。

4、适合容器使用:由于小巧、功能完备,非常适合作为容器的基础镜像。!

Jenkins

  • 概念
作为一个可扩展的自动化服务器,Jenkins可以用作简单的CI服务器,或者变成任何项目的连续交付中心。
  • 优势
1、持续集成和持续交付
2、简易安装
3、配置简单
4、插件
5、扩展
6、分布式
  • 技术要点

1、安装

* docker安装(推荐)
(1) 下载镜像:docker pull jenkins/jenkins
(2) 运行镜像:docker run --name jenkins -p 8080:8080 -p 50000:50000 -v /your/home:/var/jenkins_home jenkins
(3) 访问jenkins:ip:8080
(4) 查看sercet,日志: docker logs 容器名/容器id

* 本地安装
[官网链接](https://jenkins.io/doc/pipeline/tour/getting-started/)

2、插件库(官方插件查询地址

实战

  • 前期准备

    1、linux服务器一台(centos 7.2)

  • 操作步骤

    1、安装jenkins

    ps:运行上述jenkins安装步骤安装,密钥地址查询:docker logs 容器名/容器id

    2、访问jenkins

    地址: ip:端口号

    3、安装jenkins插件

    • Publish over SSH(远程ssh服务器插件,用于访问本地shell)

    jenkins系统配置设置

    新建任务配置

    • NodeJS Plugin(用于安装node环境,可选node版本)

    jenkins全局工具配置

    新建任务配置

    • GitHub Plugin(用于实时监听git的代码提交)

    github设置

    jenkins设置

    4、新建任务

    创建任务

    基础描述
    git仓库绑定
    构建触发器
    构建环境
    构建
    构建后操作

    End

    link