docker + nginx打包前端镜像

项目场景:

前端使用angular开发,Dockerfile如下:

FROM nginx:1.16.1 AS base

WORKDIR /app

COPY nginx.conf.template /etc/nginx/

CMD ["/bin/bash", "-c", "envsubst '${APP_VERSION}' < /app/index.html > /app/index.html && envsubst '${API_SERVER_HOST} ${API_SERVER_PORT}' < /etc/nginx/nginx.conf.template > /etc/nginx/nginx.conf && exec nginx -g 'daemon off;'"]

EXPOSE 80

FROM angular:13.2.5 AS build

WORKDIR /my-app

COPY package.json package-lock.json ./

RUN npm install

COPY . .

RUN ng build

FROM base AS final

WORKDIR /app

COPY --from=build /my-app/dist/my-app .


问题描述

首先,看到npm版本过低,需要升级版本;其次,zone.js源地址证书已过期。

先说一下证书过期的问题,

npm ERR! code CERT_HAS_EXPIRED

出现这样的错误提示一般可能是由于 npm 使用的 SSL 证书过期导致的。这意味着在您的本地环境中,npm 使用的 SSL 证书已经过期,导致无法建立安全连接。可以尝试更新 npm 的证书或者检查您的本地环境中的证书配置是否正确。

更新证书的方法:

检查 npm 版本:首先确保您正在使用比较新版本的 npm。

您可以运行以下命令来检查 npm 版本:        

npm -v

如果 npm 版本较老,可以通过以下命令来更新 npm:

npm install -g npm

或者,直接更新根证书:在某些情况下,npm 使用的根证书可能需要更新。

sudo apt update

sudo apt install --only-upgrade ca-certificates

清除 npm 缓存:有时清除 npm 缓存也可以解决证书问题。您可以运行以下命令清除 npm 缓存:

npm cache clean --force

最后,尝试重新运行您的 npm 命令,看看是否问题已经解决。

然后再说一下node更新的问题。

本地node升级之后,并没有解决问题,docker使用的还是之前的版本,注意,docker使用的node版本与本地无关!

因此问题也就很明显了,是

FROM angular:13.2.5 AS build

这一句带来的问题,这个镜像是很久之前做的,当时就是用得之前的node的版本,所以重新打包一个angular的镜像就好了。

当然也可以重新写一下Dockerfile:

FROM node:18.17.1 AS build
RUN npm install -g npm@10.5.0
RUN npm install -g @angular/cli@13.2.5
WORKDIR /my-app
COPY package.json package-lock.json .
RUN npm install
COPY . .
RUN ng build

 这样就可以了。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/739656.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【CSP考点回顾】后缀表达式计算/中缀表达式转后缀表达式

一、后缀表达式计算 后缀表达式&#xff0c;也被称为逆波兰表示法&#xff08;Reverse Polish Notation&#xff0c;简称RPN&#xff09;&#xff0c;是一种不需要括号来标识操作符优先级的数学表达式。在后缀表达式中&#xff0c;所有的操作符都跟随在它们的操作数之后&#x…

Java 错误 java.net.ConnectException

本篇文章介绍了 Java 中的 java.net.ConnectException 错误。 Java 中的 java.net.ConnectException 错误 java.net.ConnectException 是使用网络时最常见的异常。 它主要发生在客户端、应用程序和服务器之间建立 TCP 连接时。 它是一个经过检查的应用程序,可以使用 try-cat…

day2 员工管理 分类管理

文章目录 新增员工RequestBody方法参数注解 接受json数据两个对象之间属性的拷贝MD5加密 新增员工 DTO 用来接收前端传来的参数 vo用于返回数据 pojo和数据库对应 RequestBody方法参数注解 接受json数据 PostMapping("/")public Result save(RequestBody EmployeeD…

鸿蒙Harmony应用开发—ArkTS声明式开发(基础手势:Rating)

提供在给定范围内选择评分的组件。 说明&#xff1a; 该组件从API Version 7开始支持。后续版本如有新增内容&#xff0c;则采用上角标单独标记该内容的起始版本。 子组件 无 接口 Rating(options?: { rating: number, indicator?: boolean }) 从API version 9开始&#…

pinia和vuex区别?

Pinia 和 Vuex 都是用于 Vue.js 应用状态管理的工具&#xff0c;它们有一些明显的区别&#xff1a; 基于 Vue 3 和 Composition API&#xff1a; Pinia 是为 Vue 3 开发的状态管理库&#xff0c;并且充分利用了 Vue 3 的 Composition API。它提供了一种新的、基于函数的状态管理…

C++从零开始(day49)——AVLTree模拟实现

这是关于一个普通双非本科大一学生的C的学习记录贴 在此前&#xff0c;我学了一点点C语言还有简单的数据结构&#xff0c;如果有小伙伴想和我一起学习的&#xff0c;可以私信我交流分享学习资料 那么开启正题 今天分享的是关于AVLTree模拟实现 1.AVLTree概念 二叉搜索树可…

双场板功率型GaN HEMT中用于精确开关行为的电容建模

来源:Capacitance Modeling in Dual Field-Plate Power GaN HEMT for Accurate Switching Behavior (TED 16年) 摘要 本文提出了一种基于表面电势的紧凑模型&#xff0c;用于描述具有栅极和源极场板&#xff08;FP&#xff09;结构的AlGaN/GaN高电子迁移率晶体管&#xff08;…

嵌入式驱动学习第三周——设备号与字符设备的注册、分配、释放

前言 这一篇博客来谈谈字符设备的注册、分配与释放。 嵌入式驱动学习专栏将详细记录博主学习驱动的详细过程&#xff0c;未来预计四个月将高强度更新本专栏&#xff0c;喜欢的可以关注本博主并订阅本专栏&#xff0c;一起讨论一起学习。现在关注就是老粉啦&#xff01; 目录 前…

盲盒抽卡机小程序——开启神秘之旅!

亲爱的朋友们&#xff0c;欢迎来到盲盒抽卡机小程序&#xff01;这里&#xff0c;是一个充满神秘与惊喜的世界&#xff0c;让你随时随地体验抽卡的乐趣。在这里&#xff0c;你可以轻松尝试各种盲盒&#xff0c;发现隐藏的宝藏&#xff0c;感受心跳加速的刺激。 【丰富多样的盲…

Unity类银河恶魔城学习记录9-4 p92 Death of entity源代码

Alex教程每一P的教程原代码加上我自己的理解初步理解写的注释&#xff0c;可供学习Alex教程的人参考 此代码仅为较上一P有所改变的代码 【Unity教程】从0编程制作类银河恶魔城游戏_哔哩哔哩_bilibili PlayerStat using System.Collections; using System.Collections.Generi…

k8s 安全机制详解

目录 一、安全机制 三个主要安全机制 认证&#xff08;Authentication&#xff09;&#xff1a; 鉴权&#xff08;Authorization&#xff09;&#xff1a; 准入控制&#xff08;Admission Control&#xff09;&#xff1a; 二、 认证 认证方式 对比总结 认证机制框架和相关组件…

小程序学习 1

pages/goods/search/home.wxml首页功能设定 1. loading入场 2. 下拉刷新 3. 搜索栏 4. 分类切换 5. 商品列表 6. 规格弹层 7. 加载更多 <view style"text-align: center; color: #b9b9b9" wx:if"{{pageLoading}}"><t-loading theme"circula…

Java中的常见类“Math”(一)用法详解

Java 中的 Math 类包含了许多数学函数&#xff0c;可以进行各种数学计算。Math 类是 Java 标准库的一部分&#xff0c;不需要额外引入即可使用。它包含在 java.lang 包中&#xff0c;而 java.lang 包中的类会自动导入到每个 Java 源文件中&#xff0c;所以在编写 Java 程序时无…

uView Swiper 轮播图

该组件一般用于导航轮播&#xff0c;广告展示等场景,可开箱即用&#xff0c;具有如下特点&#xff1a; 自定义指示器模式&#xff0c;可配置指示器样式3D轮播图效果&#xff0c;满足不同的开发需求可配置显示标题&#xff0c;涵盖不同的应用场景具有设置加载状态和嵌入视频的能…

月份的天数

目录 题目描述 输入格式 输出格式 输入输出样例 说明/提示 题目描述 输入年份和月份&#xff0c;输出这一年的这一月有多少天。需要考虑闰年。 输入格式 输入两个正整数&#xff0c;分别表示年份 y 和月数 m&#xff0c;以空格隔开。 输出格式 输出一行一个正整数&…

【单调队列】

滑动窗口 给定一个大小为 n≤10^6 的数组。 有一个大小为 k 的滑动窗口&#xff0c;它从数组的最左边移动到最右边。 你只能在窗口中看到 k 个数字。 每次滑动窗口向右移动一个位置。 以下是一个例子&#xff1a; 该数组为 [1 3 -1 -3 5 3 6 7]&#xff0c;k 为 3。 窗口…

利用ffmpeg对两个音频文件进行混音处理

前言 最近&#xff0c;拿到了一个语音识别程序&#xff0c;想测试一下它识别的准确性。原本程序有一段自己的测试音频&#xff0c;准确性还可以&#xff0c;但是&#xff0c;自己想增加一下测试素材的复杂性。想到了在原本的测试音频中引入干扰数据&#xff08;噪点&#xff…

python中的**可以表示什么??

在Python中&#xff0c;** 有两个主要的用途&#xff1a; 作为幂运算符&#xff1a;a ** b 表示a的b次方。例如&#xff0c;2 ** 3 会返回 8&#xff0c;因为2的3次方等于8。 在函数调用或定义时作为关键字参数的解包&#xff1a; 当你有一个字典&#xff0c;并且你想将这个字…

C++从零开始(day44)——二叉搜索树

这是关于一个普通双非本科大一学生的C的学习记录贴 在此前&#xff0c;我学了一点点C语言还有简单的数据结构&#xff0c;如果有小伙伴想和我一起学习的&#xff0c;可以私信我交流分享学习资料 那么开启正题 今天分享的是关于二叉搜索树的知识点 1.二叉搜索树概念 二叉搜…