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

vue-fastapi-admin 部署心得

vue-fastapi-admin 部署心得


这两天需要搭建一个后台管理系统,找来找去 vue-fastapi-admin 这个开源后台管理框架刚好和我的技术栈所契合。于是就浅浅的研究了一下。

主要是记录如何基于原项目提供的Dockerfile进行调整,那项目文件放在容器外部,便于Diy代码。

经常接触开源项目的小伙伴都知道,通常开源项目给的 镜像 以及 Dockerfile 都是把 项目包含在内的,也就是说你可以直接跑起来体验,但是改代码之后如何反应进去就是个问题。OK,就说这么多,开始我的记录~

一、项目信息

项目名:vue-fastapi-admin
技术栈:vite + vue3 + fastapi+ Naive UI + Nginx + sqlite3
搭建环境:ubuntu22.04
项目地址:
gitee: https://gitee.com/mizhexiaoxiao/vue-fastapi-admin
github: https://github.com/mizhexiaoxiao/vue-fastapi-admin

二、拉取项目

这部分就不细说了,安装 git 工具之后,使用 git clone + 上面的项目地址即可拉取到本地。

三、修改相关文件

这部分有一个技巧,我是通过 豆包 AI去做的,整体思路就是让它去帮你把Dockerfile,后续想通过文件映射的方式启动。

中间遇到了很多问题,也学习到了很多~
这里直接给出最终的相关文件~

Dockerfile(修改)

主要是剔除了前端构建、以及删减了除 pyproject.toml 以外的项目文件。纯纯的只保留python环境构筑的部分。

FROM python:3.11-slim-bullseyeWORKDIR /opt/vue-fastapi-adminCOPY pyproject.toml .RUN --mount=type=cache,target=/var/cache/apt,sharing=locked,id=core-apt \--mount=type=cache,target=/var/lib/apt,sharing=locked,id=core-apt \sed -i "s@http://.*.debian.org@http://mirrors.ustc.edu.cn@g" /etc/apt/sources.list \&& rm -f /etc/apt/apt.conf.d/docker-clean \&& ln -sf /usr/share/zoneinfo/Asia/Shanghai /etc/localtime \&& echo "Asia/Shanghai" > /etc/timezone \&& apt-get update \&& apt-get install -y --no-install-recommends gcc python3-dev bash nginx vim curl procps net-toolsRUN pip install poetry -i https://pypi.tuna.tsinghua.edu.cn/simple \&& poetry config virtualenvs.create false \&& poetry install --no-root \&& rm pyproject.tomlENV LANG=zh_CN.UTF-8
EXPOSE 80
compose.yaml(新增)

我习惯性使用 docker compose 去操作容器,所以额外做了一个compose文件,主要是做端口映射以及项目文件的映射。这是一个前后端分离的项目,使用 nginx 做静态资源部署以及 反向代理 /api/ 请求到 fastapi 的服务。
当前配置启动后,访问宿主机的 8080 端口即可访问到前端的主页,9999 端口主要是暴露后台服务,方便我直接访问 9999/docs 接口查看接口文档的,实际上也可以不用。

version: '3'services:vue-fastapi-admin:image: vue-fastapi-admin:1.0ports:- "9999:9999"- "8080:80"volumes:- ./web:/opt/vue-fastapi-admin/web- ./deploy/web.conf:/etc/nginx/sites-available/web.conf- .:/opt/vue-fastapi-admin- ./deploy/entrypoint.sh:/opt/vue-fastapi-admin/entrypoint.shcommand: sh entrypoint.shenvironment:- LANG=zh_CN.UTF-8
compose-frontend.yaml (新增文件)

这个文件主要是为了方便编译前端代码使用的。

services:frontend:image: node:18container_name: frontendvolumes:- ./web:/app/webcommand: "sh -c 'npm config set registry https://registry.npmmirror.com && cd /app/web && npm install && npm run build'"
build.sh (新增)

这个文件是为了记录构建容器命令创建的,执行后在后台构建,可通过 build.log 文件查看构建状态。

#! /bin/bash
nohup docker build -t vue-fastapi-admin:1.0 . > build.log 2>&1 &
deploy/entrypoint.sh (修改)

主要是加入nginx配置的软连接,web.conf 配置了 api 服务的反向代理。

#!/bin/sh
set -e
rm -f /etc/nginx/sites-enabled/default
ln -s /etc/nginx/sites-available/web.conf /etc/nginx/sites-enabled/
nginx
python run.py

四、项目启动

执行顺序如下:

  1. sh build.sh 构建 vue-fastapi-admin:1.0 镜像
  2. docker compose -f compose-frontend.yaml up && docker compose -f compose-frontend.yaml down 编译前端代码,完成后删除容器
  3. docker compose -f compose up -d 启动项目

然后你可以访问 8080 端口查看你的项目:
在这之后,如果你改了前端代码,执行 2 就可以被反应上去,改了后端代码 执行 3 重启容器即可。

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

写在最后

这是我第一次搭建三方的开源管理项目,感叹自己的渺小,学到了很多新的知识,也意识到自身的问题。感谢无私奉献的大佬们,也愿看到的小伙伴能够少走弯路~

相关文章:

vue-fastapi-admin 部署心得

vue-fastapi-admin 部署心得 这两天需要搭建一个后台管理系统,找来找去 vue-fastapi-admin 这个开源后台管理框架刚好和我的技术栈所契合。于是就浅浅的研究了一下。 主要是记录如何基于原项目提供的Dockerfile进行调整,那项目文件放在容器外部&#xf…...

大语言模型微调的公开JSON数据

大语言模型微调的公开JSON数据 以下是一些可用于大语言模型微调的公开JSON数据及地址: EmoLLM数据集 介绍:EmoLLM是一系列能够支持理解用户、帮助用户心理健康辅导链路的心理健康大模型,其开源了数据集、微调方法、训练方法及脚本等。数据集按用处分为general和role-play两种…...

C++STL容器之set

1.介绍 set容器是C标准模板库(STL)中的一个关联容器,用于存储唯一的元素。set中的元素是自动排序的,不允许重复。set通常基于红黑树(一种自平衡二叉查找树)实现,因此插入、删除和查找操作的时间…...

《微软量子芯片:开启量子计算新纪元》:此文为AI自动生成

量子计算的神秘面纱 在科技飞速发展的今天,量子计算作为前沿领域,正逐渐走进大众的视野。它宛如一把神秘的钥匙,有望开启未来科技变革的大门,而微软量子芯片则是这把钥匙上一颗璀璨的明珠。 量子计算,简单来说,是一种遵循量子力学规律调控量子信息单元进行计算的新型计算…...

使用AI创建流程图和图表的 3 种简单方法

你可能已经尝试过使用 LLMs 生成图像,但你有没有想过用它们来创建 流程图和图表?这些可视化工具对于展示流程、工作流和系统架构至关重要。 通常,在在线工具上手动绘制图表可能会耗费大量时间。但你知道吗?你可以使用 LLMs 通过简…...

从波士顿动力到Figure AI:探寻人工智能驱动的机器人智能化

一、引言 1.1 研究背景与意义 在科技飞速发展的当下,机器人智能化已成为全球科技竞争的关键领域,深刻影响着人类社会的生产与生活方式。从工业制造到日常生活服务,从医疗保健到探索未知领域,机器人正逐步渗透进各个行业,展现出巨大的发展潜力与应用价值。其智能化水平的…...

算法——KMP算法(Knuth-Morris-Pratt算法)

KMP算法(Knuth-Morris-Pratt算法)是一种高效的字符串匹配算法,用于在主文本字符串中快速查找模式字符串的出现位置。其核心思想是通过预处理模式字符串,利用部分匹配信息(即“失败函数”或“next数组”)避免…...

一周学会Flask3 Python Web开发-flask3模块化blueprint配置

锋哥原创的Flask3 Python Web开发 Flask3视频教程: 2025版 Flask3 Python web开发 视频教程(无废话版) 玩命更新中~_哔哩哔哩_bilibili 我们在项目开发的时候,多多少少会划分几个或者几十个业务模块,如果把这些模块的视图方法都写在app.py…...

Pytorch实现之统计全局信息的轻量级EGAN

简介 简介:模型在EGAN的基础上改进了一个降维的自注意力机制,并且设计了一个新颖的选择算子,使用轮盘赌来选择个体,如果他们的适配度满足fchild<VALUE,则被选中的个体将被丢弃。需要在进化的初始阶段尽快找到最佳个体,并在后续阶段保持种群的多样性。 论文题目:LGE…...

Java开发实习面试笔试题(含答案)

在广州一家中大公司面试&#xff08;BOSS标注是1000-9999人&#xff0c;薪资2-3k&#xff09;&#xff0c;招聘上写着Java开发&#xff0c;基本没有标注前端要求&#xff0c;但是到场知道是前后端分离人不分离。开始先让你做笔试&#xff08;12道问答4道SQL题&#xff09;&…...

《论模型驱动架构设计方法及其应用》审题技巧 - 系统架构设计师

软件测试工程师软考论文写作框架 一、考点概述 “模型驱动架构设计及其应用”这一论题&#xff0c;主要考察了考生对模型驱动架构设计&#xff08;MDA&#xff09;这一先进软件设计方法的理解与应用能力。论题涵盖了MDA的基本概念、核心要素、实施流程及在实际项目中的应用等…...

【服务器与本地互传文件】远端服务器的Linux系统 和 本地Windows系统 互传文件

rz 命令&#xff1a;本地上传到远端 rz 命令&#xff1a;用于从本地主机上传文件到远程服务器 rz 是一个用于在 Linux 系统中通过 串口 或 SSH 上传文件的命令&#xff0c;它实际上是 lrzsz 工具包中的一个命令。rz 命令可以调用一个图形化的上传窗口&#xff0c;方便用户从本…...

初学者如何设置以及使用富文本编辑器[eclipse版]

手把手教你设置富文本编辑器 参考来源&#xff1a;UEditor Docs 初学者按我的步骤来就可以啦 一、设置ueditor编辑器 1.提取文件[文章最底部有链接提取方式] 2.解压文件并放到自己项目中&#xff0c;在WebContent目录下&#xff1a; 3. 修改jar包位置路径 到--> 注意&a…...

在 Java 中解析 JSON 数据

例子解析以下JSON数据 {"code":0,"msg":"成功","data": [{ "host":"1068222.com", "port":"", "m_token":"490e20e70e7de5f21a24b14c12a393f6", "categ…...

Python爬虫实战:从零到一构建数据采集系统

文章目录 前言一、准备工作1.1 环境配置1.2 选择目标网站 二、爬虫实现步骤2.1 获取网页内容2.2 解析HTML2.3 数据保存 三、完整代码示例四、优化与扩展4.1 反爬应对策略4.2 动态页面处理4.3 数据可视化扩展 五、注意事项六、总结互动环节 前言 在大数据时代&#xff0c;数据采…...

SpringCloud系列教程:微服务的未来(二十五)-基于注解的声明队列交换机、消息转换器、业务改造

前言 在现代分布式系统中&#xff0c;消息队列是实现服务解耦和异步处理的关键组件。Spring框架提供了强大的支持&#xff0c;使得与消息队列&#xff08;如RabbitMQ、Kafka等&#xff09;的集成变得更加便捷和灵活。本文将深入探讨如何利用Spring的注解驱动方式来配置和管理队…...

Opengl常用缓冲对象功能介绍及使用示例(C++实现)

本文整理了常用的opengl缓冲区对象并安排了使用示例 名称英文全称作用简述顶点数组对象Vertex Array Object (VAO)管理 VBO 和 EBO 的配置&#xff0c;存储顶点属性设置&#xff0c;简化渲染流程&#xff0c;避免重复设置状态顶点缓冲区对象Vertex Buffer Object (VBO)存储顶点…...

docker独立部署milvus向量数据库

milvus镜像&#xff1a;国外封锁&#xff0c;国内源也不好用。基本上所有源都不能用 首先想到阿里云服务&#xff0c;但是阿里云国外服务器便宜的300~400呢。 基于成本考虑终于装上心心念念的milvus(*^▽^*) 安装 Milvus 安装 Milvus 独立版 wget https://raw.githubuserco…...

【JT/T 808协议】808 协议开发笔记 ② ( 终端注册 | 终端注册应答 | 字符编码转换网站 )

文章目录 一、消息头 数据1、消息头拼接2、消息 ID 字段3、消息体属性 字段4、终端手机号 字段5、终端流水号 字段 二、消息体 数据三、校验码计算四、最终计算结果五、终端注册应答1、分解终端应答数据2、终端应答 消息体 数据 六、字符编码转换网站 一、消息头 数据 1、消息头…...

github配置sshkey

使用命令生成sshkey ssh-keygen -t rsa -b 4096 -C "your_emailexample.com" 依此会要求输入以下信息&#xff0c;可以使用默认值 设置保存密钥的路径 设置SSH密钥密码&#xff08;备注&#xff1a;空内容表示不设置SSH密钥密码&#xff09; 再次确认SSH密钥密…...

AtCoder 第409​场初级竞赛 A~E题解

A Conflict 【题目链接】 原题链接&#xff1a;A - Conflict 【考点】 枚举 【题目大意】 找到是否有两人都想要的物品。 【解析】 遍历两端字符串&#xff0c;只有在同时为 o 时输出 Yes 并结束程序&#xff0c;否则输出 No。 【难度】 GESP三级 【代码参考】 #i…...

cf2117E

原题链接&#xff1a;https://codeforces.com/contest/2117/problem/E 题目背景&#xff1a; 给定两个数组a,b&#xff0c;可以执行多次以下操作&#xff1a;选择 i (1 < i < n - 1)&#xff0c;并设置 或&#xff0c;也可以在执行上述操作前执行一次删除任意 和 。求…...

Android Bitmap治理全解析:从加载优化到泄漏防控的全生命周期管理

引言 Bitmap&#xff08;位图&#xff09;是Android应用内存占用的“头号杀手”。一张1080P&#xff08;1920x1080&#xff09;的图片以ARGB_8888格式加载时&#xff0c;内存占用高达8MB&#xff08;192010804字节&#xff09;。据统计&#xff0c;超过60%的应用OOM崩溃与Bitm…...

3-11单元格区域边界定位(End属性)学习笔记

返回一个Range 对象&#xff0c;只读。该对象代表包含源区域的区域上端下端左端右端的最后一个单元格。等同于按键 End 向上键(End(xlUp))、End向下键(End(xlDown))、End向左键(End(xlToLeft)End向右键(End(xlToRight)) 注意&#xff1a;它移动的位置必须是相连的有内容的单元格…...

Mobile ALOHA全身模仿学习

一、题目 Mobile ALOHA&#xff1a;通过低成本全身远程操作学习双手移动操作 传统模仿学习&#xff08;Imitation Learning&#xff09;缺点&#xff1a;聚焦与桌面操作&#xff0c;缺乏通用任务所需的移动性和灵活性 本论文优点&#xff1a;&#xff08;1&#xff09;在ALOHA…...

【JVM面试篇】高频八股汇总——类加载和类加载器

目录 1. 讲一下类加载过程&#xff1f; 2. Java创建对象的过程&#xff1f; 3. 对象的生命周期&#xff1f; 4. 类加载器有哪些&#xff1f; 5. 双亲委派模型的作用&#xff08;好处&#xff09;&#xff1f; 6. 讲一下类的加载和双亲委派原则&#xff1f; 7. 双亲委派模…...

Web中间件--tomcat学习

Web中间件–tomcat Java虚拟机详解 什么是JAVA虚拟机 Java虚拟机是一个抽象的计算机&#xff0c;它可以执行Java字节码。Java虚拟机是Java平台的一部分&#xff0c;Java平台由Java语言、Java API和Java虚拟机组成。Java虚拟机的主要作用是将Java字节码转换为机器代码&#x…...

MinIO Docker 部署:仅开放一个端口

MinIO Docker 部署:仅开放一个端口 在实际的服务器部署中,出于安全和管理的考虑,我们可能只能开放一个端口。MinIO 是一个高性能的对象存储服务,支持 Docker 部署,但默认情况下它需要两个端口:一个是 API 端口(用于存储和访问数据),另一个是控制台端口(用于管理界面…...

SpringAI实战:ChatModel智能对话全解

一、引言&#xff1a;Spring AI 与 Chat Model 的核心价值 &#x1f680; 在 Java 生态中集成大模型能力&#xff0c;Spring AI 提供了高效的解决方案 &#x1f916;。其中 Chat Model 作为核心交互组件&#xff0c;通过标准化接口简化了与大语言模型&#xff08;LLM&#xff0…...

Ubuntu系统多网卡多相机IP设置方法

目录 1、硬件情况 2、如何设置网卡和相机IP 2.1 万兆网卡连接交换机&#xff0c;交换机再连相机 2.1.1 网卡设置 2.1.2 相机设置 2.3 万兆网卡直连相机 1、硬件情况 2个网卡n个相机 电脑系统信息&#xff0c;系统版本&#xff1a;Ubuntu22.04.5 LTS&#xff1b;内核版本…...