当前位置: 首页 > news >正文

前端-如何通过docker打包Vue服务成镜像并在本地运行(本地可以通过http://localhost:8080/访问前端服务)

1、下载安装docker,最好在vs code里安装docker的插件。

下载链接:https://www.docker.com/products/docker-desktop

🎉 Docker 简介和安装 - Docker 快速入门 - 易文档 (easydoc.net)

2、准备配置文件-dockerfile文件和nginx.conf文件

dockerfile文件:基本配置如下

FROM registry.cn-beijing.aliyuncs.com/hiacloud/nginx:1.25.1
COPY dist/ /usr/share/nginx/html

另外准备一份nginx.conf文件(网上可搜)

3、命令行操作

首先下载vue的依赖,并且打包在本地生成dist文件

然后运行docker命令

//打包成镜像
docker build -t my-nginx-image .
//启动服务
docker run -d -p 8080:80 my-nginx-image

接着就可以在本地通过http://localhost:8080/访问前端服务。

注意点

没有nginx.conf,会导致前端路由跳转报错。

相关文章:

前端-如何通过docker打包Vue服务成镜像并在本地运行(本地可以通过http://localhost:8080/访问前端服务)

1、下载安装docker,最好在vs code里安装docker的插件。 下载链接:https://www.docker.com/products/docker-desktop 🎉 Docker 简介和安装 - Docker 快速入门 - 易文档 (easydoc.net) 2、准备配置文件-dockerfile文件和nginx.conf文件 do…...

零基础学习【Mybatis】这一篇就够了

Mybatis 查询resultType使用resultMap使用单条件查询多条件查询模糊查询返回主键 动态SQLifchoosesetforeachsql片段 配置文件注解增删改查结果映射 查询 resultType使用 当数据库返回的结果集中的字段和实体类中的属性名一一对应时, resultType可以自动将结果封装到实体中 r…...

Shell入门(保姆级教学)

Shell是一种命令行解释器,也是一种脚本语言,广泛应用于Unix和类Unix系统中,例如Linux。它是用户与操作系统内核交互的桥梁,通过Shell可以执行系统命令、管理文件系统、处理文本数据等。本文将带你入门Shell编程,涵盖基…...

【JDK11和JDK8并行与切换】

一、JDK11安装 1、下载jdk11,点击.exe安装在:C:\Program Files\Java\jdk-11\ 2、配置JAVA_HOME 变量名为JAVA_HOME 变量值为jdk安装路径 3、配置PATH 找到系统变量里的PATH 双击或者单击后点击编辑 点击右上角的新建 新建两条 %JAVA_HOME%\bin …...

vue大数据量列表渲染性能优化:虚拟滚动原理

前面咱完成了自定义JuanTree组件各种功能的实现。在数据量很大的情况下,我们讲了两种实现方式来提高渲染性能:前端分页和节点数据懒加载。 前端分页小节:Vue3扁平化Tree组件的前端分页实现 节点数据懒加载小节:Element Tree Plu…...

昇思25天学习打卡营第1天|快速入门

目录 昇思MindSpore介绍MindSpore的API来快速实现一个简单的深度学习模型通过资料更深入的了解昇思MindSpore 昇思MindSpore介绍 今天有幸学习了昇思MindSpore,让我们来简单的了解一下它 昇思MindSpore是一个全场景深度学习框架,旨在实现易开发、高效执行…...

LinkedList 实现 LRU 缓存

LRU(Least Recently Used,最近最少使用)缓存是一种缓存淘汰策略,用于在缓存满时淘汰最久未使用的元素。 关键: 缓存选什么结构? 怎么实现访问顺序? import java.util.*;public class LRUCac…...

ubuntu安装workon

pip install virtualenvpip install virtualenvwrapper配置virtualenvwrapper。在你的shell配置文件(比如.bashrc,.bash_profile或.zshrc)中添加以下内容:export WORKON_HOME$HOME/.virtualenvs export VIRTUALENVWRAPPER_PYTHON/…...

(面试必看!)锁策略

文章导读 引言考点一、重量级锁 VS 轻量级锁1、定义与原理2、主要区别3、适用场景 考点二、乐观锁 VS 悲观锁1、悲观锁(Pessimistic Locking)2、乐观锁(Optimistic Locking)3、总结 考点三、读写锁1、读写锁的特性2、读写锁的实现…...

RAGflow:开源AI框架的创新与应用

在当今科技飞速发展的时代,人工智能(AI)已经成为各行各业不可或缺的一部分。特别是在文档处理和数据分析领域,AI的应用更是无处不在。今天,我要向大家介绍一个开源的AI框架引擎——RAGflow。它能够在深度文档理解方面执…...

AI的学习明确路径

1.不要一开始学习数学。 首先,学习python的语法和工具包。 python的工具包有:numpy,pandas,matlap,sciklt-learn. 然后,学习机械学习算法,学习1.树模型,随机森林 。 2.神经网络。 上kaggle中,找人家的经…...

【C++】巧用缺省参数与函数重载:提升编程效率的秘密武器

C语法相关知识点可以通过点击以下链接进行学习一起加油!命名空间 本章将分享缺省参数与函数重载相关知识,为了更加深入学习C打下了坚实的基础。本章重点在于缺省参数与函数重载使用前提与注意事项 🌈个人主页:是店小二呀 &#x1…...

mysql排查死锁的几个查询sql

SHOW PROCESSLIST; select * from information_schema.INNODB_TRX; select * from information_schema.INNODB_LOCKS; select * from information_schema.INNODB_LOCK_WAITS;...

快速部署私有化大模型 毕昇(使用docker-compose方式)

docker安装 1. # Linux系统安装docker,以CentOS/RHEL为例,其他操作系统请参考docker官方安装方法 # 如果已经安装过docker 期望重装,先卸载 sudo yum remove docker \docker-client \docker-client-latest \docker-common \docker-latest \d…...

B端:导航条就框架提供的默认样式吗?非也,看过来。

导航条不一定必须使用框架提供的默认样式,你可以根据项目需求和设计风格进行自定义。通过使用框架提供的自定义选项、CSS样式覆盖、自行设计或者使用其他UI库或组件,你可以实现独特且符合需求的导航条样式。 下面发一些参考给友友们,可以让设…...

idea的git与SVN切换

1、选择setting->Version Control,新增或者编辑,选择目录,使用git或者svn管理 2、选择项目中的vcs.xml,打开选择要用的,注释掉不用的版本即可...

互联网家政小程序,为大众带来高效、便捷的服务

随着人口老龄化的严重和社会生活节奏的加快,大众对家政服务的需求日益增加,家政行业的市场规模逐渐扩大! 在科技的推动下,家政行业开始向数字化发展,“互联网家政”的模式推动了市场的快速发展。互联网家政小程序借助…...

【常用库】【pytorch】基本部件

基本元件 1. 卷积 2. batchnorm loss函数 torch.nn.MSELoss() >>> a torch.rand(3) >>> a tensor([0.2161, 0.2227, 0.9175]) >>> b torch.rand(3) >>> b tensor([0.6976, 0.9149, 0.4918]) >>> mse torch.nn.MSELOSS() &…...

深入Scrapy框架:掌握其工作流程

深入Scrapy框架:掌握其工作流程 引言 作为一名资深的Python程序员,我对各种数据采集工具有着深刻的理解。Scrapy,作为一个上场率极高的爬虫框架,以其高效、灵活和强大的特性,成为数据采集领域的不二选择。在本文中&a…...

从零开始学习机器学习,掌握AI未来的关键!

从零开始学习机器学习 1. 介绍1.1 人工智能(AI)概述1.2 机器学习在人工智能中的应用1.3 机器学习基础概念 2. 监督学习2.1 什么是监督学习2.2 回归分析2.3 分类问题2.4 模型评估和选择 3. 无监督学习3.1 什么是无监督学习3.2 聚类算法3.3 降维技术 4. 深…...

DeepSeek 赋能智慧能源:微电网优化调度的智能革新路径

目录 一、智慧能源微电网优化调度概述1.1 智慧能源微电网概念1.2 优化调度的重要性1.3 目前面临的挑战 二、DeepSeek 技术探秘2.1 DeepSeek 技术原理2.2 DeepSeek 独特优势2.3 DeepSeek 在 AI 领域地位 三、DeepSeek 在微电网优化调度中的应用剖析3.1 数据处理与分析3.2 预测与…...

vscode(仍待补充)

写于2025 6.9 主包将加入vscode这个更权威的圈子 vscode的基本使用 侧边栏 vscode还能连接ssh? debug时使用的launch文件 1.task.json {"tasks": [{"type": "cppbuild","label": "C/C: gcc.exe 生成活动文件"…...

Auto-Coder使用GPT-4o完成:在用TabPFN这个模型构建一个预测未来3天涨跌的分类任务

通过akshare库,获取股票数据,并生成TabPFN这个模型 可以识别、处理的格式,写一个完整的预处理示例,并构建一个预测未来 3 天股价涨跌的分类任务 用TabPFN这个模型构建一个预测未来 3 天股价涨跌的分类任务,进行预测并输…...

DIY|Mac 搭建 ESP-IDF 开发环境及编译小智 AI

前一阵子在百度 AI 开发者大会上,看到基于小智 AI DIY 玩具的演示,感觉有点意思,想着自己也来试试。 如果只是想烧录现成的固件,乐鑫官方除了提供了 Windows 版本的 Flash 下载工具 之外,还提供了基于网页版的 ESP LA…...

SpringBoot+uniapp 的 Champion 俱乐部微信小程序设计与实现,论文初版实现

摘要 本论文旨在设计并实现基于 SpringBoot 和 uniapp 的 Champion 俱乐部微信小程序,以满足俱乐部线上活动推广、会员管理、社交互动等需求。通过 SpringBoot 搭建后端服务,提供稳定高效的数据处理与业务逻辑支持;利用 uniapp 实现跨平台前…...

C++课设:简易日历程序(支持传统节假日 + 二十四节气 + 个人纪念日管理)

名人说:路漫漫其修远兮,吾将上下而求索。—— 屈原《离骚》 创作者:Code_流苏(CSDN)(一个喜欢古诗词和编程的Coder😊) 专栏介绍:《编程项目实战》 目录 一、为什么要开发一个日历程序?1. 深入理解时间算法2. 练习面向对象设计3. 学习数据结构应用二、核心算法深度解析…...

CSS | transition 和 transform的用处和区别

省流总结: transform用于变换/变形,transition是动画控制器 transform 用来对元素进行变形,常见的操作如下,它是立即生效的样式变形属性。 旋转 rotate(角度deg)、平移 translateX(像素px)、缩放 scale(倍数)、倾斜 skewX(角度…...

PHP 8.5 即将发布:管道操作符、强力调试

前不久,PHP宣布了即将在 2025 年 11 月 20 日 正式发布的 PHP 8.5!作为 PHP 语言的又一次重要迭代,PHP 8.5 承诺带来一系列旨在提升代码可读性、健壮性以及开发者效率的改进。而更令人兴奋的是,借助强大的本地开发环境 ServBay&am…...

tomcat入门

1 tomcat 是什么 apache开发的web服务器可以为java web程序提供运行环境tomcat是一款高效,稳定,易于使用的web服务器tomcathttp服务器Servlet服务器 2 tomcat 目录介绍 -bin #存放tomcat的脚本 -conf #存放tomcat的配置文件 ---catalina.policy #to…...

windows系统MySQL安装文档

概览:本文讨论了MySQL的安装、使用过程中涉及的解压、配置、初始化、注册服务、启动、修改密码、登录、退出以及卸载等相关内容,为学习者提供全面的操作指导。关键要点包括: 解压 :下载完成后解压压缩包,得到MySQL 8.…...