本篇文章給大家?guī)?lái)了關(guān)于docker快速入門(mén)的相關(guān)知識(shí)，其中包括常用操作命令、鏡像操作命令、容器操作命令等相關(guān)問(wèn)題，希望對(duì)大家有幫助。

給前端的docker 10分鐘真 · 快速入門(mén)指南

2022年了，咱前端花點(diǎn)時(shí)間學(xué)點(diǎn)docker，不吃虧不上當(dāng)

還沒(méi)有了解過(guò)docker嗎，沒(méi)關(guān)系，咱模擬幾個(gè)場(chǎng)景，兩分鐘就給你搞明白它是什么，我們什么時(shí)候需要它

接著我們拿剩下的七八分鐘用docker來(lái)同時(shí)部署vue2、vue3兩個(gè)項(xiàng)目，對(duì)就是這么快！

1 docker是什么

場(chǎng)景模擬1：?jiǎn)螜C(jī)

在公司勤勤懇懇的你很快得到了領(lǐng)導(dǎo)的認(rèn)可，這天他讓你接手這下面幾個(gè)新項(xiàng)目，你需要將它們安裝在自己的電腦上

慧眼的你發(fā)現(xiàn)，這里有多個(gè)不同版本的nodejs和mysql：還行，對(duì)我來(lái)說(shuō)小意思

場(chǎng)景模擬2：多機(jī)

此時(shí)公司新來(lái)了3個(gè)前端實(shí)習(xí)生和新人，領(lǐng)導(dǎo)要你把這幾個(gè)項(xiàng)目也給他們安裝在本地電腦運(yùn)行

由于公司歷史等原因，暫時(shí)只能給他們配置了不同操作系統(tǒng)的電腦：win7、win10、OSX等等

現(xiàn)在你需要把這幾個(gè)項(xiàng)目分別安裝在幾臺(tái)電腦的不同操作系統(tǒng)上，看圖

機(jī)智的你發(fā)現(xiàn)，你的頭現(xiàn)在一個(gè)比兩個(gè)大

“安裝麻煩費(fèi)時(shí)間，新來(lái)的人做項(xiàng)目的時(shí)候，還得針對(duì)不同項(xiàng)目去切換匹配的版本來(lái)用，容易犯錯(cuò)這也給主機(jī)環(huán)境造成污染這也給主機(jī)環(huán)境造成污染，一想到未來(lái)還有更多的項(xiàng)目要這么搞，這時(shí)候可能有人已經(jīng)想跑路了”

辛辛苦苦安裝完成后，看你這么給力，領(lǐng)導(dǎo)又讓你在公司內(nèi)網(wǎng)的兩臺(tái)小服務(wù)器上部署一下這幾個(gè)項(xiàng)目，做公共的開(kāi)發(fā)和測(cè)試環(huán)境，哦對(duì)這兩臺(tái)服務(wù)器是linux的，你是不是準(zhǔn)備開(kāi)始百度如何在linux 安裝node 和 mysql了？而且還是要安裝多個(gè)版本的。要是這兩臺(tái)服務(wù)器的linux系統(tǒng)還不同呢？

現(xiàn)在到輪到你想提桶了吧

3 docker出場(chǎng)

別慌，這時(shí)候docker出場(chǎng)了，它能幫你抹平不同系統(tǒng)的應(yīng)用程序安裝差異

等等，那為啥不用虛擬機(jī)？

因?yàn)樘摂M機(jī)啟動(dòng)慢、損耗大、占用資源多，在不同系統(tǒng)上的遷移/拓展比較復(fù)雜

但是docker它不會(huì)啊，它啟動(dòng)是秒級(jí)的，占用資源少，香不香，跨平臺(tái)還方便復(fù)制

寫(xiě)好配置后，它一個(gè)命令就在電腦上同時(shí)安裝不同版本的nodej、msyql、nginx 等而且是互相隔離獨(dú)立同時(shí)運(yùn)行，這時(shí)候還不需要你手動(dòng)來(lái)回切換

上面的問(wèn)題不就輕松解決了嗎，現(xiàn)在你對(duì)docker感興趣了沒(méi)

2 docker 基礎(chǔ)

現(xiàn)在我們開(kāi)始來(lái)了解一下docker的基礎(chǔ)吧

docker 分幾個(gè)概念：鏡像、容器、倉(cāng)庫(kù)

鏡像：就是像是我們裝機(jī)時(shí)候需要的系統(tǒng)盤(pán)或者系統(tǒng)鏡像文件，這里它負(fù)責(zé)創(chuàng)建docker容器的，有很多官方現(xiàn)成的鏡像：node、mysql、monogo、nginx可以從遠(yuǎn)程倉(cāng)庫(kù)下載

容器：可以比擬成一個(gè)迷你的系統(tǒng)，例如一個(gè)只安裝mysql5.7的linux最小系統(tǒng)，當(dāng)然你喜歡也可以把mysql、node安裝在同一個(gè)容器中，記住，容器與容器，容器和主機(jī)都是互相隔離的

倉(cāng)庫(kù)：倉(cāng)庫(kù)就像是github那樣的，我們可以制作鏡像然后push 提交到云端的倉(cāng)庫(kù)，也可以從倉(cāng)庫(kù) pull 下載鏡像

3 安裝

docker的安裝很簡(jiǎn)單，win、osx都是圖形界面安裝，linux的也幾行命令,現(xiàn)在的mac的m1芯片系列也支持了，這里我們先略過(guò)安裝步驟，要快！先看完！

ps:在m1芯片的docker上安裝mysql需要稍加點(diǎn)配置

安裝好運(yùn)行下方代碼查看

docker -v

4 實(shí)戰(zhàn)：部署vue2和vue3項(xiàng)目

安裝好docker后，我們現(xiàn)在來(lái)實(shí)戰(zhàn)了，搓搓手

我們要讓電腦同時(shí)運(yùn)行nodejs10和nodejs12多個(gè)版本

ps: 咱先快速入門(mén)，我們暫時(shí)先把不同版本的mysql安裝放一邊哈

4.1 準(zhǔn)備vue2 、 vue3項(xiàng)目

先跟著一起做，咱后面再解釋

現(xiàn)在新建一個(gè)文件放我們的項(xiàng)目：命名 為 :my-repository

安裝vue2+webpack項(xiàng)目

# 0 命令行進(jìn)入到該文件夾的位置：  cd /你的電腦具體的文件路徑/my-repository  # 1.現(xiàn)在安裝vue-cli npm install -g @vue/cli  # 2.查看vue-cli安裝成功否 vue --version #我這里是@vue/cli 4.5.15  # 3. 用vue-cli快速創(chuàng)建項(xiàng)目,安裝選項(xiàng)我們?nèi)缦?# > ? Default ([Vue 2] babel, eslint)  # > ? npm包管理 vue create my-app-vue2

安裝vue3+vite項(xiàng)目

#先安裝vite最新版npm init vite@latest# 創(chuàng)建vue3項(xiàng)目npm init vite@latest my-app-vue3 --template vue

//vite需要開(kāi)啟網(wǎng)絡(luò)訪問(wèn)//vite.config.js 開(kāi)啟hostexport default defineConfig({   plugins: [vue()],+  server: {+    host: '0.0.0.0',+  },});

#安裝完成后我們的目錄是這樣的my-repository ├── my-app-vue2 │   ├── public │   └── src │       ├── assets │       └── components └── my-app-vue3     ├── public     └── src         ├── assets         └── components

4.2 創(chuàng)建運(yùn)行docker容器

# 0 先進(jìn)入我們剛才安裝了vue項(xiàng)目的文件夾位置 cd my-repository  # 1 執(zhí)行pwd可以獲取當(dāng)前文件夾在電腦的絕對(duì)目錄 pwd # /Users/eric/my-repository  # 2 運(yùn)行創(chuàng)建docker容器1：承載 vue2+webpack+nodejs10 docker run -it -d --name myvue2 --privileged -p 8081:8080 -v  /Users/eric/my-repository/my-app-vue2:/app/vue node:10.16.2 /bin/bash -c "cd /app/vue && node -v && npm install && npm run serve"  # 3 運(yùn)行創(chuàng)建docker容器2：承載 vue3+vite+nodejs12 docker run -it -d --name myvue3 --privileged -p 8080:3000 -v /Users/eric/my-repository/my-app-vue3:/app/vue node:12.22.6 /bin/bash -c "cd /app/vue && node -v && npm install && npm run dev"  #運(yùn)行成功后 查看容器運(yùn)行情況 docker ps -a

成功運(yùn)行后會(huì)出現(xiàn)

我們可以看到容器的啟動(dòng)狀態(tài)、端口映射、容器名字

打開(kāi)瀏覽器，我們?cè)L問(wèn)localhost:8080和localhost:8081可以看到

如果出錯(cuò)可看下面第三點(diǎn)：[調(diào)試](###3 調(diào)試)：運(yùn)行如下命令查看原因

docker logs -f container_id/containe_name

上面那一坨docker run xxxxx 的代碼到底是啥，現(xiàn)在我們就來(lái)捋順

首先這個(gè)docker run 是可以用來(lái)創(chuàng)建同時(shí)啟動(dòng)運(yùn)行容器

先換行來(lái)看 : shell 腳本太長(zhǎng)的時(shí)候我們可以用 “”把一行命令分成多行

docker run  -it  -d   --name myvue2  --privileged  -p 8081:8080  -v /Users/eric/my-repository/my-app-vue2:/app/vue  node:10.16.2  /bin/bash -c "cd /app/vue2 && node -v && npm install && npm run serve"

這里我們使用 docker run 命令可以下載鏡像 ->通過(guò)鏡像創(chuàng)建容器 ->啟動(dòng)運(yùn)行容器

參數(shù)解析：

docker run的運(yùn)行示意圖

上面代碼運(yùn)行成功后我們的電腦就會(huì)有兩個(gè)互相隔離獨(dú)立運(yùn)行的docker容器

4.3 調(diào)試

常用的調(diào)試命令 1

# 運(yùn)行后按ctrl + c 可退出docker logs -f contianer_name/container_id

當(dāng)然容器內(nèi)正在進(jìn)行編譯或者發(fā)生錯(cuò)誤甚至退出的時(shí)候，我們可用此命令查看終端輸出的信息

運(yùn)行成功后，查看myvue 容器的npm run serve 在終端上的實(shí)時(shí)輸出信息

#查看docker container的終端輸出信息 docker logs -f myvue2

常用的調(diào)試命令 2

# 打印出容器的端口映射、目錄掛載、網(wǎng)絡(luò)等等docker inspect myvue2

5 常用操作命令

常用的操作命令表一欄，需要先收藏

鏡像操作命令：

# 搜索鏡像 docker search [images_name:tag]  # 下載鏡像（：指定版本） docker pull [images_name:tag]  # 查看本地下載的鏡像 docker images  # 自己構(gòu)建鏡像 # 根據(jù)dockerfile的路徑或者url構(gòu)建鏡像  docker build [OPTIONS] PATH|URL|-  # 查看鏡像的構(gòu)建歷史 docker history [images_name]  # 刪除鏡像 # 需要先刪除以此鏡像為基礎(chǔ)的容器  docker rmi [images_name]

容器操作命令

# 查看運(yùn)行中的容器 # 可以查看容器ID、基礎(chǔ)鏡像、容器名稱、運(yùn)行狀態(tài)、端口映射等 docker ps  # 查看所有容器：包括停止的 docker ps -a  # 查看容器的信息 # 例如端口號(hào)的映射、目錄掛載 docker inspect [images_name/images_id]  # 啟動(dòng)和停止容器 docker start/stop [container_name/container_id]  #  重啟容器 #  使用場(chǎng)景實(shí)例： #  在加入新的npm包依賴需要重新編譯的時(shí)候使用重啟運(yùn)行編譯 #  nginx容器的配置更新后需要重啟生效 docker restart [container_name/container_id]  # 進(jìn)入容器 # ps:有些容器沒(méi)有bash,需要改成/bin/sh，例如mysq、mongodb的 # 退出人容器輸入exit 回車鍵 docker exec -it [container_name/container_id] /bin/bash  # 刪除容器 # 在容器停止的狀態(tài)才能刪 docker rm [container_name/container_id]  # 容器主機(jī)文件拷 # 將容器文件拷貝到主機(jī) docker cp [container_id/container_name] : [文件目錄](méi) [主機(jī)目錄](méi)  # 將主機(jī)的目錄拷貝到容器 docker cp [主機(jī)目錄](méi) [container_id/container_name] : [文件目錄](méi)

6 進(jìn)階

如果沒(méi)有合適的鏡像，我們通常用Dockerfile來(lái)構(gòu)建自定義鏡像

發(fā)現(xiàn)沒(méi)，上面的docker run 只能創(chuàng)建啟動(dòng)一個(gè)docker容器，我們可以用docker-compose來(lái)一次啟動(dòng)多個(gè)容器，常用于單機(jī)下安裝多個(gè)服務(wù)

慢點(diǎn)再來(lái)更新，大家有興趣也可以先看到我用docker 部署的Jenkins自動(dòng)化部署 CI/CD 環(huán)境 里面也有docker-compose的使用

推薦學(xué)習(xí)：《docker視頻教程》

以上就是讓人心動(dòng)的