原文链接
Docker独自部署前端我的项目和Node我的项目是十分便捷的,在这里分享一下Docker的应用,次要聊聊它的部署实际。(我是window10专业版装置Docker)

Docker

Docker是一种利用容器引擎技术,相似于虚拟机,不过它的实用性、通用性、便捷性更强,Docker容器能够说就是VM,不过占用资源更少,更轻量,通过操作系统级虚拟化办法,利用更加节俭的硬件资源提供给用户更多的计算资源。

Docker容器是Linux 容器的一种封装,因为容器存在独立的运行环境,Docker能够将应用程序和依赖打包容器中,启动容器即可运行程序。

Docker部署

Docker容器配合 GitHub Action、Jenkins、Rancher应用十分的便捷,当然这里说到的是Docker集体部署实际,上面次要说到的是通用前端我的项目部署计划。

配置nginx

在前端根目录创立 nginx.conf(与package.json同级),具体配置如下,能够依据理论我的项目调整批改:

server {    listen 80 default_server;    server_name _;        location / {      root   /usr/share/nginx/html/web;      index  index.html index.htm;      try_files $uri $uri/ /index.html;    }        # 接口代理示例    # location /api {    #     proxy_pass http://xxx.com;    #     proxy_set_header Host $host:$server_port;    #     proxy_set_header X-Real-IP $remote_addr;    #     proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;    #     proxy_set_header Cookie $http_cookie;    #     proxy_buffering off;    #     proxy_cache off;    # }  }

nginx配置的次要的作用是动态资源代理,同时接口转发。以上的配置是间接再本机运行,如果要在服务器上运行,能够将其中的配置改为:

listen 80;server_name xxx.com;

配置Dockerfile

在根目录创立Dockerfile文件(与package.json同级)

FROM node:latestCOPY package.json /RUN npm i --registry=https://registry.npm.taobao.orgRUN npm run buildFROM nginx:latest# 这里的dist/目录是你的我的项目打包后的文件目录COPY ./dist/ /usr/share/nginx/html/COPY ./nginx.conf /etc/nginx/conf.d/EXPOSE 80

下面的配置文件十分的简略,次要就是将构建打包,之后装置nginx,复制nginx配置文件,复制打包后的文件,凋谢80端口。

Docker镜像部署

将我的项目更新到服务器上,在服务器运行Docker构建命令( 当然也能够再本地构建):

Docker build -t docker/web:v1.0 .

docker/web:v1.0 是镜像名称,特地留神后页面那个点不能省略。

启动容器

docker run -d -p 8080:80 docker/web:v1.0

docker/web:v1.0 是构建镜像时设置的名称,8080:80代表将nginx的80映射到你服务器的8080端口(留神你服务器的端口是否凋谢8080,其余端口也能够;如果是本地拜访,不必思考这个)。

镜像启动胜利后,浏览器输出localhost:8080即可拜访了。