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 ...
随机推荐
- (Java)常用类库
Spring 常用工具类 Spring作为常用的开发框架,在Spring框架应用中,排在ApacheCommon.Guava.Huool等通用库后,第二优先级可以考虑使用Spring-core-xxx ...
- 【java深入学习第2章】Spring Boot 结合 Screw:高效生成数据库设计文档之道
在开发过程中,数据库设计文档是非常重要的,它可以帮助开发者理解数据库结构,方便后续的维护和扩展.手动编写数据库设计文档不仅耗时,而且容易出错.幸运的是,可以使用Spring Boot和Screw来自动 ...
- oeasy教您玩转vim - 85 - # 全局命令
"h", "b", "f", "d", "e", "a", "c& ...
- KU FPGA FLASH boot失败debug
原因 新板子回来后,测试flash 烧录正常,但是无法BOOT,此时SPI设置为X4模式,使用内部时钟,速度90M.烧录过程不报错,校验也正常. FLASH理论支持最大速度108M,90M应该还好.另 ...
- 断点续传:使用java对大文件进行分块与合并
通常我们下载上传的视频文件比较大.虽然https协议没有规定上传文件大小的限制,但是网络的质量,电脑硬件的参差不齐可能会导致大文件快要上传完成的时候突然断网了要重新上传,非常影响用户体验.以此我们引入 ...
- hmall | 引入ES实现高效搜索与同步双写
在gitee.飞书.百度云.B站中,黑马都没有上传该部分资料,以下皆为个人观点,如有纰漏欢迎指正 1.先把item-service中的searchcontroller抽出来,抽到一个模块中并将其设为h ...
- 免费正版 IntelliJ IDEA license 详细指南
一.前言 IntelliJ IDEA 一直是我非常喜欢的 IDE 自从用上之后就回不了头了,但是 Ultimate 版本的费用十分昂贵,其实 JetBrains 自己就提供了6种免费申请授权的方式:本 ...
- 支付宝退款和结果查询接口简单实现(.Net 7.0)
〇.前言 支付宝对 .Net 的支持还是比较充分的,在每个接口文档中都有关于 C# 语言的示例,这样就大大降低了对接的难度,很容易上手. 官方接口文档地址:退款-alipay.trade.refund ...
- 11、SpringMVC之文件下载和上传
创建名为spring_mvc_file的新module,过程参考9.1节和9.5节 11.1.文件下载 11.1.1.创建图片目录并放置图片 11.1.2.页面请求示例 <a th:href=& ...
- 【SpringMVC】 Controller接收深度复杂对象封装不到的问题
首先来看数据结构的定义: 一个Form对象,然后里面有一个排版日期对象的List集合 排班集合的每个元素中又有一个String集合 在前端的Post请求中可以看到这个String集合是传递了的 但是D ...