欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Docker容器部署前端Vue服務(小白教程)

 更新時間:2022年03月16日 14:42:00   作者:春夏丶秋冬  
本文主要介紹了Docker容器部署前端Vue服務,文中根據(jù)實例編碼詳細介紹的十分詳盡,具有一定的參考價值,感興趣的小伙伴們可以參考一下

需要工具

  • Xftp
  • Xshell

首先對前端項目進行打包:npm run build 

打包完成

在項目中生成dist文件:

通過Xshell在/home目錄下創(chuàng)建項目文件夾

mkdir xxxx(文件名)

通過Xftp將打包的dist文件上傳到服務器的項目文件夾下;

利用Xshell在拉起nginx鏡像

docker pull nginx

在項目文件夾下編寫nginx config配置文件

vim default.conf

default.conf內(nèi)容如下:

server {
    listen       80;
    server_name  localhost; # 修改為docker服務宿主機的ip
 
    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html =404;
    }
 
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }
}

該配置文件定義了首頁的指向為 /usr/share/nginx/html/index.html, 所以我們可以一會把構建出來的index.html文件和相關的靜態(tài)資源放到/usr/share/nginx/html目錄下。

在項目文件夾下編寫Dockerfile文件

vim Dockerfile

Dockerfile內(nèi)容如下:

FROM nginx
 
MAINTAINER zouzou
 
RUN rm /etc/nginx/conf.d/default.conf
 
ADD default.conf /etc/nginx/conf.d/
 
COPY dist/ /usr/share/nginx/html/

Dockerfile內(nèi)容解釋

FROM nginx:該鏡像是基于nginx:latest鏡像構建的
 
MAINTAINER zouzou:添加說明
 
RUN rm /etc/nginx/conf.d/default.conf:刪除目錄下的default.conf文件
 
ADD default.conf /etc/nginx/conf.d/:將default.conf復制到/etc/nginx/conf.d/下,用本地的default.conf配置來替換nginx鏡像里的默認配置
 
COPY dist/ /usr/share/nginx/html/:將項目根目錄下dist文件夾(構建之后才會生成)下的所有文件復制到鏡像/usr/share/nginx/html/目錄下

如下三個文件保持在同一目錄  

構建docker鏡像

docker build -t xxxx .

注意不要少了最后的“.”(點)   -t是給鏡像命名,.(點)是基于當前目錄的Dockerfile來構建鏡像

查看剛剛構建的鏡像

docker images | grep xxxx

啟動docker容器

docker run -d -p 9090:80 --name test xxxx

解釋:

  • docker run:基于鏡像啟動一個容器
  • -d:后臺方式啟動
  • -p 9090:80: 端口映射,將宿主機的9090端口映射到容器的80端口
  • --name:容器名,我起的叫test
  • xxxx:要啟動的鏡像名稱

查看啟動的容器

docker ps

訪問

現(xiàn)在我們已經(jīng)啟動了,訪問宿主機的地址:9090就可以看到我們部署的網(wǎng)站了

到此這篇關于Docker容器部署前端Vue服務(小白教程)的文章就介紹到這了,更多相關Docker容器部署Vue內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!

相關文章

  • 詳解使用export/import導出和導入docker容器

    詳解使用export/import導出和導入docker容器

    本篇文章主要介紹了詳解使用export/import導出和導入docker容器,小編覺得挺不錯的,現(xiàn)在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
    2017-07-07
  • 查詢Docker鏡像DockerFile的方法步驟

    查詢Docker鏡像DockerFile的方法步驟

    本文主要介紹了查詢Docker鏡像DockerFile的方法步驟,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2023-08-08
  • docker安裝redis5.0.3的方法步驟

    docker安裝redis5.0.3的方法步驟

    這篇文章主要介紹了docker安裝redis5.0.3的方法步驟,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2019-12-12
  • Docker中忽略文件的實現(xiàn)

    Docker中忽略文件的實現(xiàn)

    Docker忽略文件是指在Docker鏡像構建過程中,用于忽略指定文件或目錄的一種機制,本文主要介紹了Docker中忽略文件的實現(xiàn),具有一定的參考價值,感興趣的可以了解一下
    2023-10-10
  • 解決Mac下 docker 無法 ping 通宿主機的問題

    解決Mac下 docker 無法 ping 通宿主機的問題

    這篇文章主要介紹了解決Mac下 docker 無法 ping 通宿主機的問題,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
    2020-11-11
  • Docker使用GPU全過程

    Docker使用GPU全過程

    這篇文章主要介紹了Docker使用GPU全過程,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
    2024-01-01
  • docker目錄和本地目錄互通的實現(xiàn)

    docker目錄和本地目錄互通的實現(xiàn)

    本文介紹了如何實現(xiàn)Docker目錄和本地目錄互通,通過這種方式,可以輕松地在Docker容器和本地文件系統(tǒng)之間共享數(shù)據(jù),感興趣的可以了解一下
    2023-08-08
  • Docker+K8S 集群環(huán)境搭建及分布式應用部署

    Docker+K8S 集群環(huán)境搭建及分布式應用部署

    這篇文章主要介紹了Docker+K8S 集群環(huán)境搭建及分布式應用部署,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2020-07-07
  • 詳解復制備份docker容器數(shù)據(jù)的方法

    詳解復制備份docker容器數(shù)據(jù)的方法

    這篇文章主要介紹了詳解復制備份docker容器數(shù)據(jù)的方法,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
    2020-03-03
  • docker-compose.yml參數(shù)的用法(配置文件)

    docker-compose.yml參數(shù)的用法(配置文件)

    這篇文章主要介紹了docker-compose.yml參數(shù)的用法(配置文件),具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
    2023-11-11

最新評論