When we develop the Angular app inside Docker container, we can simulate Production envioment by build Angualr App instead of using 'ng serve':

ng build --watch --delete-output-path false

'--delete-output-path false': tells it do not delete the dist folder when doing the build.

nginx.dockerfile file:

FROM nginx:alpine
LABEL author="Dan Wahlin"
COPY ./config/nginx.conf /etc/nginx/conf.d/default.conf # Use the following commands to build the image and run the container (run from the root folder)
# 1. You'll first need to build the project using `ng build --watch --delete-output-path false` # 2. Now build the Docker image:
# docker build -t nginx-angular -f nginx.dockerfile . #3. Run the Docker container:
# To run the container we'll create a volume to point to our local source code. On Mac
# you can use $(pwd) to reference your local folder where your running Docker commands from.
# If you're on Windows there are several options to point to the folder. See my following post:
# https://blog.codewithdan.com/2017/10/25/docker-volumes-and-print-working-directory-pwd/ # docker run -p 8080:80 -v $(pwd)/dist:/usr/share/nginx/html nginx-angular

[Angular CLI] Build application without remove dist folder for Docker Volume的更多相关文章

  1. 使用 Angular CLI 和 Webpack 分析包尺寸

    使用 Angular CLI 和 Webpack 分析包尺寸 对于 Web app 来说,高性能总是最高优先级,对于 Angular 也不例外.但是随着应用复杂度的不断增长,我们如何才能知道哪些内容打 ...

  2. 使用Angular CLI进行Build (构建) 和 Serve

    第一篇文章是: "使用angular cli生成angular5项目" : http://www.cnblogs.com/cgzl/p/8594571.html 第二篇文章是: & ...

  3. [转]How to Add Bootstrap to an Angular CLI project

    本文转自:https://loiane.com/2017/08/how-to-add-bootstrap-to-an-angular-cli-project/ In this article we w ...

  4. 从Java角度理解Angular之入门篇:npm, yarn, Angular CLI

    本系列从Java程序员的角度,带大家理解前端Angular框架. 本文重点介绍Angular的开发.编译工具:npm, yarn, Angular CLI,它们就像Java在中的Maven,同时顺便介 ...

  5. (转载)从Java角度理解Angular之入门篇:npm, yarn, Angular CLI

    本系列从Java程序员的角度,带大家理解前端Angular框架. 本文是入门篇.笔者认为亲自动手写代码做实验,是最有效最扎实的学习途径,而搭建开发环境是学习一门新技术最需要先学会的技能,是入门的前提. ...

  6. Angular CLI behind the scenes, part one

    原文:https://commandlinefanatic.com/cgi-bin/showarticle.cgi?article=art074 --------------------------- ...

  7. Using Sass with the Angular CLI

    https://www.tuicool.com/articles/mauiMzY One of the first things you'll usually do in a project is t ...

  8. Angular CLI 升级 6.0 之后遇到的问题

    Angular CLI 1.7.4 在使用 ng build --prod 会构建失败,而 ng build 是正常的.比较好的解决办法是使用 ng build --prod --extract-li ...

  9. .Net Core + Angular Cli / Angular4 开发环境搭建

    一.基础环境配置 1.安装VS 2017 v15.3或以上版本 2.安装VS Code最新版本 3.安装Node.js v6.9以上版本 4.重置全局npm源,修正为 淘宝的 NPM 镜像: npm  ...

随机推荐

  1. 任务调度框架FluentScheduler简介

    之前我在文章中介绍过.net中的任务调度框架Hangfire,HangFire虽然本身输入比较简单好用的,但是,如果我们的程序本身提供的服务不是任务调度,而任务调度只是里面并不重要的小功能的时候,用H ...

  2. HDU 4747 Mex (2013杭州网络赛1010题,线段树)

    Mex Time Limit: 15000/5000 MS (Java/Others)    Memory Limit: 65535/65535 K (Java/Others)Total Submis ...

  3. LPC43xx双核笔记

    简介本页提供了一些使用LPC43xx器件双核特性的基本信息.此页面上的信息和专题使用Keil uVision4工具,以双核工程的使用来演示.该工程初始化两个内核以运行FreeRTOS,并采用三色LED ...

  4. ubuntu单独安装字体包

    查看当前字体的命令: fc-list 文泉驿字体下载地址: http://wenq.org/wqy2/index.cgi?ZenHei#v0_8 下载到的是一个deb安装包 在下载完字体以后将字体包拷 ...

  5. java容器类---概述

    1.容器类关系图 虚线框表示接口. 实线框表示实体类. 粗线框表示最经常使用的实体类. 点线的箭头表示实现了这个接口. 实线箭头表示类能够制造箭头所指的那个类的对象. Java集合工具包位于Java. ...

  6. [经使用有效]Sqlserver2005附加数据库时出错提示操作系统错误5(拒绝访问)错误5120的解决办法

    sqlserver2005附加数据库时出错提示操作系统错误5(拒绝访问)错误5120的解决办法 最近几天从网上找了几个asp.net的登录案例想要研究研究代码,结果在用 Sql Server2005附 ...

  7. 内存映射函数remap_pfn_range学习——示例分析(2)

    li {list-style-type:decimal;}ol.wiz-list-level2 > li {list-style-type:lower-latin;}ol.wiz-list-le ...

  8. 搭建《深入Linux内核架构》的Linux环境

    作者 彭东林 pengdonglin137@163.com 软件 Host: Ubuntu14.04 64 Qemu 2.8.0 Linux 2.6.24 busybox 1.24.2 gcc 4.4 ...

  9. WMAppManifest.xml

    大家在编写Windows phone的程序的时候可能并没有关注WMAppManifest.xml,其实这个档案是记录了应用程式的相关属性描述,以及定义应用程式的功能性的..所以还是相当重要的一个文档, ...

  10. SharePoint Online 切换经典视图

    SharePoint online 默认是现代视图,我们可以通过Powershell命令切换默认视图. 以下,是完成的Powershell命令: # This file uses CSOM. Repl ...