zoukankan      html  css  js  c++  java
  • Docker+Nginx部署Angular

    在部署Angular生产环境之前,需要电脑已经安装docker。

    添加Dockerfile
    在已经完成的Angular项目的项目根目录下添加Dockerfile文件。

    Dockerfile文件内容:

    FROM nginx:1.11-1.11-alpine
    COPY index.html /usr/share/nginx/html/index.html
    EXPOSE 80
    CMD ["nginx", "-g", "daemon off;"]

    编译Angular
    ng build --prod
    此时会在项目目录下生成dist文件夹,里面是我们项目打包之后的文件。

    然后将Dockerfile文件复制到dist目录下,并修改。

    FROM nginx:1.11-1.11-alpine
    COPY . /usr/share/nginx/html/index.html
    EXPOSE 80
    CMD ["nginx", "-g", "daemon off;"]

    然后进入dist目录下

    cd dist

    创建docker镜像
    docker build -t angular5
    查看当前所有镜像和运行的容器
    docker images

    # 显示结果

    REPOSITORY TAG IMAGE ID CREATED SIZE
    nginx latest c5c4e8fa2cf7 5 days ago 109MB
    angular5 latest 3c493d859707 10 days ago 55.6MB
    nginx 1.11-alpine bedece1f06cc 12 months ago 54.3MB

    docker ps
    # 显示结果
    CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES

    运行镜像
    端口不要和本地端口冲突,比如如果8082被使用,请更换
    docker run -d --name demo1 -p 8082:80 angular5
    # 成功结果
    CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
    bddc01ddf0a3 nginx "nginx -g 'daemon of…" 1 minutes ago Up 3 seconds 0.0.0.0:8082->80/tcp demo1

    浏览器访问:127.0.0.1:8082即可访问。

    停止运行
    docker stop bddc01ddf0a3 # 这个是id可以使用前几位,或者使用NAMES demo1
    启动一个容器
    docker ps -a #查看所有容器
    docker start bddc01ddf0a3 #或者名字


  • 相关阅读:
    Silverlight+WCF 新手实例 象棋 介绍四(三十一)
    python 抓包(转)
    Python字符集编码和文件读写 [转]
    python操作Excel读写使用xlrd(转)
    Wing IDE 中文显示方法
    Python使用win32gui.SetWindowPos置顶窗口(转)
    python url格式解析(转)
    TCP/IP 某些最常见的错误原因码 (errno)列表(转)
    WinPcap过滤串表达式的语法
    python读取注册表值(转)
  • 原文地址:https://www.cnblogs.com/jiangzhaowei/p/10027644.html
Copyright © 2011-2022 走看看