利用docker容器安装node,使用vue的开发环境

目录

vue-app
├── docker-data
│ ├── site
│ ├── app
├── docker-compose.yaml
└── deploy.sh

docker-compose.yaml

yaml文件执行

version: '3.8'services:node:image: node:latestcontainer_name: vue-appports:- "8080:8080" # 宿主8080映射容器8080volumes:- ./docker-data/site/app:/app  # 宿主路径容器工作路径working_dir: /app #执行下面command命令时工作目录restart: alwayscommand: bash -c  "npm install &&  npm run dev"  # 启动容器执行命令

deploy.sh

#!/bin/bash
set -e
docker compose pull
docker compose up -d --remove-orphans

vue-app/docker-data/site/app下放vite创建的vue项目

在这里插入图片描述

修改vite.config.ts

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'// https://vitejs.dev/config/
export default defineConfig({plugins: [vue()],server: {port: 8080, //指定端口host: '0.0.0.0', //一定要写这个,不然宿主机 8080端口会打不开站点},
})

打开终端,进去vue-app目录

cd /Volumes/disk/site/docker/vue-app

在这里插入图片描述

输入命令,启动容器

./deploy.sh 
或者输入命令 
docker compose up -d

浏览器打开localhost:8080

在这里插入图片描述

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

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

相关文章

系统服务综合项目

要求: 现有主机 node01 和 node02,完成如下需求: 1、在 node01 主机上提供 DNS 和 WEB 服务 2、dns 服务提供本实验所有主机名解析 3、web服务提供 www.rhce.com 虚拟主机 4、该虚拟主机的documentroot目录在 /nfs/rhce 目录 5、该目录由 no…

如何保证语音芯片的稳定性能和延长使用寿命

要让语音芯片保持稳定性能,首先需要深入理解其工作原理和内部构造。语音芯片,作为现代电子设备中的核心组件之一,承载着声音信号的处理与输出功能。为了确保其稳定运行,我们需要从多个方面进行细致的考虑和操作。‌ 1、避免长期高…

Windows系统MySQL的安装,客户端工具Navicat的安装

下载mysql安装包,可以去官网下载:www.mysql.com。点击downloads 什么?后面还有福利? 下载MySQL 下载企业版: 下载Windows版 5点多的版本有点低,下载8.0.38版本的。Window系统。下载下面的企业版。不下载…

乡镇集装箱生活污水处理设备处理效率高

乡镇集装箱生活污水处理设备处理效率高 乡镇集装箱生活污水处理设备优势 结构紧凑:集装箱式设计减少了占地面积,便于在土地资源紧张的乡镇地区部署。 安装方便:设备出厂前已完成组装和调试,现场只需进行简单的连接和调试即可投入使…

[数字图像处理]基础知识整理(部分,持续更新)

程序中描述一副图像,已知其横向纵向的像素个数即可() 灰度直方图能反映一副图像各个灰度级像素占图像的面积比(√) 从程序编写的角度看,描述一副图像的基本属性通常包括其分辨率,即图像的宽度…

Docker镜像和容器的管理

1 Docker镜像管理操作 开启镜像加速 根据关键字查询镜像 下载查看镜像 详细镜像信息 查看latest版本 上传镜像到阿里云仓库 2 Docker容器操作 关于容器根据第一个pid进程是否能正常在前台运行

19. 地址转换

地址转换 题目描述 Excel 是最常用的办公软件。每个单元格都有唯一的地址表示。比如:第 12 行第 4 列表示为:"D12",第 5 行第 255 列表示为"IU5"。 事实上,Excel 提供了两种地址表示方法,还有一…

算法训练营第30天|122.买卖股票的最佳时机II|55. 跳跃游戏|45.跳跃游戏II|1005.K次取反后最大化的数组和

122.买卖股票的最佳时机II 思路:只有前一天与后一天的利润为正时,才将其加入总利润。 55. 跳跃游戏 思路:找最大覆盖范围 出错点:数组的遍历,遍历范围应该是覆盖范围内 45.跳跃游戏II 思路: 局部最优&am…

批量爬取B站网络视频信息

使用XPath爬取B站视频链接等相关信息 分析B站html框架获取内容完整代码 对于B站,目前网上的爬虫大多都是使用通过解析服务器的响应来爬取想要的内容,下面我们通过使用XPath来爬取B站上一些想要的信息 此次任务我们需要对B站搜索到的关键字,并…

数据结构 —— FloydWarshall算法

数据结构 —— FloydWarshall算法 FloydWarshall算法三种最短路径算法比较1. Dijkstra算法2. Bellman-Ford算法3. Floyd-Warshall算法总结 我们之前介绍的两种最短路径算法都是单源最短路径,就是我们要指定一个起点来寻找最短路径,而我们今天介绍的Floyd…

ctfshow-web入门-文件上传(web166、web167)(web168-web170)免杀绕过

目录 1、web166 2、web167 3、web168 4、web169 5、web170 1、web166 查看源码,前端只让传 zip 上传 zip 成功后可以进行下载 随便搞一个压缩包,使用记事本编辑,在其内容里插入一句话木马: 上传该压缩包,上传成功…

附下载 | 100项能源领域网络与数据安全政策全集(2024版)

能源是工业的粮食,能源安全事关国家根本安全。当今国际局势风云变幻,全球地缘政治、经济、科技体系正经历深刻变化,能源局势将更加错综复杂,威胁能源安全的各种“灰犀牛”“黑天鹅”事件时有发生,促使国际能源版图深刻…

system V共享内存【Linux】

文章目录 原理shmgetftokshmat(share memory attach)shmdt,去关联(share memory delete attach)shmctl ,删除共享内存共享内存与管道 原理 共享内存本质让不同进程看到同一份资源。 申请共享内存: 1、操作系统在物理内存当中申请…

详解Redis:什么是Redis?

什么是Redis? Redis(Remote Dictionary Server)是一种开源的、高性能的、基于内存快速读写的的数据结构存储系统,常用于缓存,分布式锁等场景; Redis常用数据类型有哪些? String(字符串) 适用场景…

Qt中实现让静态图片动起来,创建动画效果

在现代应用程序开发中,动画效果是提升用户体验的重要元素之一。Qt作为一个强大的跨平台应用程序框架,提供了丰富的工具和库来创建各种动画效果。本文将介绍如何在Qt中使用静态图片创建动画效果。 实现方法一 使用QTimer和QPixmap 1.准备图片资源&#…

Qt图形与图片(Qt位置相关函数、Qt基础图形的绘制、双缓冲机制、显示SVG格式图片)

此篇文章介绍几种主要位置函数及其之间的区别,以及各种与位置相关函数的使用场合;然后,通过一个简单绘图工具实例,介绍利用QPainter和QPainterPath两种方法绘制各种基础图形;最后,通过几个实例介绍如何利用…

暑假自律日记十

7.11 (半小时日记打卡之——暑假第十天) 日程 8.30起床 9.20到达逸夫楼开始总结区间DP,上午完成了区间DP和四边形优化部分的学习 下午组队打了一场去年的牛客多校,压力有点大,问题也有点多,总而言之&…

GD32F303RET6读取SGM58031电压值

1、SGM58031芯片详解 (1)SGM58031是一款低功耗,16位精度,delta-sigma (ΔΣ)模数转换器(ADC)。它从3V到5.5V供电。 (2)SGM58031包含一个片上参考和振荡器。它有一个I2C兼容接口,可以选择四个I2…

深入Memcached键值对限制:优化存储策略

标题:深入Memcached键值对限制:优化存储策略 Memcached作为一种广泛使用的高性能分布式内存缓存系统,对键值对的大小有特定的限制。这些限制不仅关系到缓存效率,还直接影响到缓存数据的组织和内存的使用。本文将深入探讨Memcache…

【RHCE】系统服务综合实验

一、实验内容 现有主机 node01 和 node02,完成如下需求: 1、在 node01 主机上提供 DNS 和 WEB 服务 2、dns 服务提供本实验所有主机名解析 3、web服务提供 www.rhce.com 虚拟主机 4、该虚拟主机的documentroot目录在 /nfs/rhce 目录 5、该目录由 node02…