docker曾经是开发畛域的大明星,如果你当初对它不理解,那么是时候学习它了。

本文情景:须要一个能够跑特定angular版本的docker容器,用于对立我的项目的开发环境以及跑单元测试

技术要求:装置了docker并且会一些罕用的docker命令。

背景

以后咱们须要一个能够运行angular以及能够主动跑单元测试的容器,但遗憾的是docker hub中并不存在现成的容器

找镜像

尽管没有angular的镜相,但咱们能够找到node的镜像,因为咱们在本机开发应用的node版本是14.16.0,所以在确认node镜像时也应用雷同的版本。

关上官网地址,最终发现有几个版本可供咱们抉择,在版本方面存在alpine,buster,stretch等。简略来说就是一个准则:老手应用stretch/buster/jessie,新手本人轻易选。

本地构建

镜相确认后,便能够开始进行本地构建了。

第一步,咱们先在本地建设一个文件,命名为:Dockerfile,须要留神的该文件没有任何扩展名

第二步:编辑这个文件,并输出以下内容

FROM node:14.16.0-stretch

第三步:开始构建
来到Dockerfile的存在文件夹,执行$ docker build . -t <imagename:version>,即开始进行镜相结构,该速度在肯定水平上依赖于网速。其中imagename:version本人起喜爱的,比方咱们在此起名为node-angular:14.16.0

最初,咱们应用docker image ls命令来查看image是否创立胜利

自定义image

接下来,咱们应用以后image来构建能够执行angular单元测试的node环境。

在持续工作前,咱们须要意识到:一个image能够创立多个container,它们的关系就是class与object。而任何container又都能够成为一个新的image。

咱们以后要做的工作其实是:

  1. 依据上一步build失去的image来创立一个新的container
  2. 在这个container(官网名字叫容器,能够了解为一个小的独立的虚拟机)上进行环境设置,使其满足Angular的单元测试要求。
  3. 将曾经满足Angular的单元测试要求的container要做为image来保留下来。

日后再须要进行Angular相干测试时,便能够间接应用这个image来创立新的container了。

配置container

启动容器并进入

$ docker run -it node-angular:14.16.0 /bin/bash

此时,上述命令行实际上曾经在运行起来的container上了,前面咱们运行的命令都将在这个container上运行并最终被保留下来。

装置chrome

接管咱们参考官网的教程,来装置chrome.

顺次执行以下命令:

$ apt-get update$ wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.deb$ apt install -y ./google-chrome*.deb;$ export CHROME_BIN=/usr/bin/google-chrome

更新装置源:

下载chrome:

装置chrome:

设置环境变量:

装置Angular-cli

持续装置angular-cli

$ npm install -g @angular/cli

装置vim

本文还须要对一些文件进行一些简略的编辑,所以把vim也一并装置上。

$ apt-get install -y vim

测试

咱们创立一个angular利用,并尝试进行测试.

$ ng new app$ cd app

此时,咱们须要编辑一下karma的配置文件:

$ vi karma.conf.js

将以配置:

browsers: ['Chrome'],

变更为:

browsers: ['Chrome', 'ChromeHeadless', 'ChromeHeadlessCI'],customLaunchers: {  ChromeHeadlessCI: {    base: 'ChromeHeadless',    flags: ['--no-sandbox']  }},

最初退出编辑器,并执行以下命令进行单元测试:

$ ng test "--no-watch" "--no-progress" "--browsers=ChromeHeadlessCI"

新建image

容器确认可用后,便能够进行该容器了。上面咱们以这个container为根底,创立一个新的image.

首先应用docker ps -a命令来查看所有的container,并找到咱们想要的那个container id

$ docker commit <containerid> <repositroy:tag>

比方咱们在此创立一个14.16.0-0版本:

$ docker commit 6dab5bce9bab node-angular:14.16.0-0

接下来,咱们便能够应用这个新的image来创立新的container了.

$ docker image ps$ docker run -it node-angular:14.16.0-0 /bin/bash

测试一下ng还在,阐明确实是咱们想要的那个环境。

当前,当咱们再想在本机上启动一个angula的测试环境时,便能够依赖咱们以后这个node-angular:14.16.0-0了.

docker仓库

如果你有docker仓库的话,还能够将以后的image间接推送到docker仓库中,这样以来,其它同样领有该仓库权限的小伙伴便能够疾速的应用该image了。但大多数状况下,咱们是通过主动构建来达到推送仓库这一目标,比方阿里云便提供了构建docker image的收费仓库服务。

而在这些仓库中构建的最好的方法是通过配置Dockerfile,也就是说:咱们能够把本文中执行的一些环境装置的命令也放到Dockerfile中。

接下来,咱们便能够找找本文中的历史命令,在把这些命令复制到Dockerfile中,再而后上传到代码仓库,并联合阿里云的构建来实现自建构建了。

本文前面给出一些截图和代码,具体的作用因为超出了本文的主题领域,不再过多形容:

Dockerfile

FROM node:14.16.0-stretchRUN apt-get updateRUN wget https://dl.google.com/linux/direct/google-chrome-stable_current_amd64.debRUN apt install -y ./google-chrome*.deb;RUN export CHROME_BIN=/usr/bin/google-chromeRUN apt install -y vimRUN npm install -g @angular/cliRUN apt-get clean

上传到github仓库

文件实现后,指定好一个文件夹,而后上传到github仓库

主动构建

而后来到阿里云的容器镜像服务,创立一个新镜像

认证后增加个构建规定:

点击立刻构建:

查看构建日志:

后果小插曲呈现了:

因为家喻户晓(wo xiang ma jie)的起因阿里云的海内机器,居然无奈连贯阿里云的国内机器。。。好吧,要么咱们重试两次,要么咱们把构建规定中的海内机器构建(一些包的装置,国内机器可能会构建不胜利)勾销掉看看。

而后果然在执行 apt-get update 更新包信息的时候卡住了,不过还好是主动构建,只有是有速度,那么我就崇奉:忍一时惊涛骇浪。抉择忍。

通过了漫长的期待当前,终于:

构建实现后,咱们便能够像应用其它的官网image一样,在任何机器上都能够疾速的获取到一份装置有chrome并且node版本是14.16.0的运行容器了。

创立container

接下来便能够依据 公网地址的信息在任意装置有docker而网络通顺的机器上来运行咱们刚刚创立的image了.

因为在构建时指定的版本号并不是latest,所以在启动container时,须要指定好特定的版本号:14.16.0

$ docker run -it registry.cn-beijing.aliyuncs.com/mengyunzhi/node-chrome:14.16.0 /bin/bash

此时因为image的地址是阿里云的,所以在进行image拉取的时候还是十分快的。

至此,一个能够用于进行angular单元测试的image便胜利地被构建出并能够共享给团队中其它的小伙伴来应用了。

总结

本文介绍了如何通过官网的镜像(非官方镜像也能够)打造了一个自定义性能的镜像。镜像实现了,推送到了国内的阿里云仓库,向阿里云仓库推送的益处是其它成员在应用的时候会有一个比拟好的网络环境,害处是它并没有共享到docker官网的hub中,这并不是一个好的共享形式。

其实docker就是一个小的虚拟机机制,docker中的image就相当于备份的操作系统,而依据image来创立的container就是运行的虚拟机。所以:一个image能够创立多个container,就像能够依据一个操作系统盘来在多个电脑上装置同样的操作系统一样。如果你应用过一些操作系统的clone软件的话,置信对上述概念并不生疏。