Docker 通過Nginx映象部署Vue專案

編寫dockerfile

部署執行

為了演示我這邊新建乙個專案

# cnpm install //等待安裝

# cnpm run build //build打包發布檔案

可以看到這裡dist資料夾中已經包含我們要發布的東西了

我這裡使用hub163中的映象

# docker pull hub.c.163.com/library/nginx

from hub.c.163.com/library/nginx //使用nginx

maintainer jounghu <[email protected]> //作者
run rm /etc/nginx/conf.d/default.conf //刪除nginx 預設配置
adddefault.conf /etc/nginx/conf.d/ //新增我們自己的配置 default.conf 在下面
copy dist/ /usr/share/nginx/html/ //把剛才生成dist資料夾下的檔案copy到nginx下面去

default.conf:

server 

#error_page 404 /404.html;
# redirect server error pages to the static page /50x.html
# error_page 500
502503
504 /50x.html;
location = /50x.html 
# proxy the php scripts to apache listening on 127.0.0.1:80
##location ~ \.php$ 
# pass the php scripts to fastcgi server listening on 127.0.0.1:9000
##location ~ \.php$ 
# deny access to .htaccess files, if apache's document root
# concurs with nginx's one
##location ~ /\.ht 
}

注意：把dockerfile 和 default.conf 放到剛才專案的根目錄下

vue-docker 檔案結構：

如上部署就全部完成

瀏覽器輸入 http://localhost:9000 即可看到執行結果

寫在後面

docker實戰之通過nginx映象來部署靜態頁

本章我們主要講解如何通過docker構建乙個nginx容器，這裡我們以部署乙個靜態html為素材來進行演示。首先我們通過 docker search nginx 命令來查詢docker hub上的nginx映象 這裡我們拉取官方的映象就可以了，通過 docker pull nginx 命令。拉取完以...

docker安裝nginx映象

1 安裝nginx 檢視可用版本 2 拉取官方最新版本映象 docker pull nginx latest 3 檢視本地映象 docker images 4 執行容器 docker run name mynginx it p 80 80 v data data d nginx 其中 name表示容...

docker 建立nginx映象

1 使用commit來構建映象 commit是基於原有映象基礎上構建的映象，使用此方法構建映象的目的 儲存映象裡的一些配置資訊和修改的資訊。相當於乙個映象的快照。2 使用dockerfile來構建映象 dockerfile是快速構建所需 自定義 映象。這裡centos的可能最新，先來一波解釋 下面直...