vue serve 部署 步骤说明
1. 构建镜像
docker build -t 镜像名称:镜像TAG --build-arg URL=http://localhost:8081 --build-arg PORT=2000 --build-arg SSL_PORT=443 -f Dockerfile .
如果不运行https,则要把最后的-S 指定证书与SSL_PORT注释掉
Dockerfile内容如下:
FROM node:14.17.0-alpine
ARG URL=http://localhost:8080/
# 设定URL变量初始值为:http://localhost:8080/
ENV URL ${URL}
# 获取传递的动态URL变量值
RUN echo ${URL}
# 打印动态URL变量值
RUN export NODE_OPTIONS=--max_old_space_size=8172
# 设定临时环境变量
RUN mkdir -p /app
# 在镜像内根目录下 创建文件夹app
COPY ./package.json /app/package.json
# 将执行当前构建命令所在的path的同级package.json文件 复制到镜像内app文件夹中
ARG PORT=3000
# 设定PORT变量初始值为:3000,即http服务的端口
ENV PORT ${PORT}
# 获取传递的动态PORT变量值,即https服务的端口
ARG SSL_PORT=443
# 设定SSL_PORT变量初始值为:443
ENV SSL_PORT ${SSL_PORT}
# 获取传递的动态SSL_PORT变量值
RUN npm config set registry https://registry.npm.taobao.org \
&& npm config set sass_binary_site=https://npm.taobao.org/mirrors/node-sass \
&& npm install -g serve
# npm设定淘宝镜像源地址
# 依赖可使用serve或http-server
# RUN npm install -g http-server RUN cd /app \
&& npm install
# 进入app文件夹下,执行npm install命令
COPY ./ /app
# 将执行当前构建命令所在的path同级的所有文件 复制到镜像内app文件夹中
WORKDIR /app
# 指定WORKDIR 工作目录
# RUN mv /node_modules /app/ 如果本地有依赖,且部署环境与当前构建镜像的环境一致
# 则可在当前构建环境中执行 npm install, 然后将依赖文件夹复制到app文件夹中
CMD cd /app \
&& npm run build \
&& serve -S --ssl-cert ./certificate/server.crt --ssl-key ./certificate/server.key -p ${SSL_PORT} dist \
&& serve -p ${PORT} dist
# 打包
# https 运行(需要证书)
# http 运行
EXPOSE ${SSL_PORT} ${PORT}
Dockerfile相关:
将当前路径下的xxx文件夹copy到镜像内部,add当前路径下指定的.txt文件,复制到镜像内部,并改名为app.txt
WORKDIR /home/root
USER root
COPY ./xxx/* ./xxx/
ADD ./*.txt app.txt
vue serve 部署 步骤说明的更多相关文章
- 【Vue】vue项目目录介绍 es6的导入导出语法 vue项目开发规范 Vue项目编写步骤
目录 昨日回顾 今日内容 0 vue-cli创建项目 node.js环境 创建vue-cli项目 1 vue项目目录介绍 node_modules index.html app.vue package ...
- Storm集群安装部署步骤【详细版】
作者: 大圆那些事 | 文章可以转载,请以超链接形式标明文章原始出处和作者信息 网址: http://www.cnblogs.com/panfeng412/archive/2012/11/30/how ...
- unison + inotify 实现文件实时双向同步部署步骤
unison + inotify 实现文件实时双向同步部署步骤 一. Unison简介 Unison是Windows.Linux以及其他Unix平台下都可以使用的文件同步工具,它能使两个文件夹(本地或 ...
- Hexo学习笔记--常用命令及部署步骤
参考资料: Hexo搭建Github静态博客:http://www.cnblogs.com/zhcncn/p/4097881.htmlHexo:独立博客新玩法:http://www.aips.me/h ...
- SharePoint2010 部署步骤“激活功能”中出现错误:无法启动计算机“PCName”上的服务SPUserCodeV4
在SharePoint2010开发中,选择部署类型为“部署为沙盒解决方案”,在部署代码是出现如下错误提示: 部署步骤“激活功能”中出现错误:无法启动计算机“PCName”上的服务SPUserCodeV ...
- Storm集群安装部署步骤
本文以Twitter Storm官方Wiki为基础,详细描述如何快速搭建一个Storm集群,其中,项目实践中遇到的问题及经验总结,在相应章节以"注意事项"的形式给出. 1. Sto ...
- Thinkphp框架部署步骤
Thinkphp框架部署步骤 thinkphp框架部署起来简单,但是由于步骤较多也容易遗忘: 这是安装了集成环境后的一个www根目录结构: 然后需要在这个目录下面创建一个文件夹做项目:thinkphp ...
- node vue 项目部署问题汇总
场景:vue-router为history模式,不带项目名访问的部署,如果资源是用相对路径加载,则资源匹配路径不对 一.带项目名称访问,如部署到tomcat服务上 webpack: build/ut ...
- Vue脚手架使用步骤 2.9.6版本
转载自:https://blog.csdn.net/sky_LQ/article/details/80729547 Vue脚手架使用步骤 2018年06月19日 12:10:35 sky_LQ 阅读数 ...
- 阿里云CentOS 7.4 64位,jdk1.6、mysql5.7、tomcat6部署步骤(个人记录)
jdk1.6.mysql5.7.tomcat6部署步骤 一.安装jdk1.6 查看当前系统jdk的版本:java -version 方法一:利用yum源来安装jdk(此方法不需要配置环境变量) 查看y ...
随机推荐
- [FLET] 02 route 测试
from typing import Dict import flet from flet import AppBar, ElevatedButton, Page, Text, View, color ...
- 拟合算法与matlab工具包实现
与插值问题不同,在拟合问题中不需要曲线一定经过给定的点.拟合问题的目标是寻求一个函数(曲线),使得该曲线在某种准则下与所有的数据点最为接近,即曲线拟合的最好(最小化损失函数) 目录 一.插值和拟合的区 ...
- Java基本数学运算之Math类
什么是Math类 Java操作数学运算相关的类 构造函数被私有化,所以不允许创建对象 都是静态方法,使用是直接类名.方法名 常用API //计算平⽅根 System.out.println(Math. ...
- 苹果手机使用charles抓包无法下载charles证书
苹果手机使用charles抓包无法下载charles证书的问题记录: 使用:chls.pro/ssl --------无效 使用:http://chls.pro/ssl ---- ...
- git fetch origin
可以运行 git fetch origin 来同步远程服务器上的数据到本地.该命令首先找到 origin 是哪个服务器(本例为 git.ourcompany.com),从上面获取你尚未拥有的数据,更新 ...
- Vue Axios二次封装
// axios二次封装 import axios from 'axios' import qs from 'qs' /*** *判断环境变量区分接口的默认地址 */ switch (process. ...
- 如何平稳地从nacos迁移到r-nacos?
1. 引言 很多同学了解r-nacos特性后最开始只将r-nacos用于开发测试环境. 经过一段时间的使用后,部分同学有打算生成环境也从nacos迁移到r-nacos. 一些之前使用nacos服务的同 ...
- 【Java】Properties 配置信息类
Properties 配置信息类 Properties 是HashTable的子类,该对象用于处理属性文件 由于属性文件的Key.Value都是字符串类型,所以Properties里的Key和Valu ...
- Parallel and Sequential Data Structures and Algorithms
并串行 从零开始考前突击并串行数据结构与算法 强烈建议和原教材参照着看 Introduction 本书的要点 定义问题 不同的算法解决 设计抽象数据类型和相应的数据结构实现 分析比较算法和数据类型的代 ...
- 自动驾驶开源数据库 —— nuscenes
地址: https://www.nuscenes.org/