首页
学习
活动
专区
圈层
工具
发布
社区首页 >专栏 >VCompose部署全攻略:轻松实现Docker Compose拖拽式编排

VCompose部署全攻略:轻松实现Docker Compose拖拽式编排

原创
作者头像
江湖有缘
发布于 2026-10-08 13:04:45
发布于 2026-10-08 13:04:45
220
举报
文章被收录于专栏:Docker项目实战Docker项目实战

一、VCompose介绍

1.1 VCompose简介

VCompose 是一款专为开发者打造的可视化 Docker Compose 编辑器,旨在彻底告别手动编写 YAML 文件时繁琐的缩进调整、镜像标签记忆及依赖关系核对。它提供了一个完全在浏览器端运行的可视化画布,支持拖拽服务、绘制连接即可生成生产级 YAML 配置,且全程无需注册、无后端服务器介入,确保所有数据绝对安全不泄露。

1.2 VCompose核心特点

  • 可视化画布:支持拖拽操作,内置 111+ 种常用服务及 16 个开箱即用的预构建技术栈。
  • 连线定义依赖:通过直观的画线连接服务,即可自动生成准确的 depends_on 依赖配置。
  • 实时 YAML 预览:提供带有语法高亮功能的实时 YAML 输出面板,代码改动一目了然。
  • AI 智能生成:支持使用自然语言描述需求,兼容 OpenAI、Anthropic、Gemini 等多种主流 AI 模型自动生成配置。
  • MCP 深度集成:完美适配 MCP 协议,可直接在 Claude、Cursor 或其他兼容工具中无缝调用。
  • YAML 反向导入:支持粘贴现有的 Docker Compose 文件,一键将其转换为可视化的拓扑图。
  • 智能服务推荐:能根据当前选择自动推荐配套服务(例如为 PostgreSQL 自动推荐 pgAdmin)。
  • 网络自动配置:当服务之间建立连接时,系统会自动将其分配至共享网络,免去手动配置烦恼。
  • 完整撤销重做:支持标准的 Ctrl+Z / Ctrl+Y 快捷键,提供流畅的撤销与重做操作体验。
  • 本地持久化存储:工作进度会自动保存至浏览器的本地存储(localStorage),防止意外丢失。

二、本次实践规划

2.1 本地环境规划

本次实践为个人测试环境,操作系统版本为 Ubuntu 24.04.2 LTS。

hostname

IP地址

操作系统版本

Docker版本

部署项目

备注

jeven

192.168.3.88

Ubuntu 24.04.2 LTS

28.5.0

VCompose

——

2.2 本次实践介绍

1.本次实践部署环境为个人测试环境,生产环境请谨慎;

2.在Docker环境下部署Docker compose管理工具VCompose。

三、本地环境检查

3.1 检查Docker服务状态

检查Docker服务是否正常运行,确保Docker正常运行。

代码语言:bash
复制
root@jeven:~# systemctl status docker
● docker.service - Docker Application Container Engine
     Loaded: loaded (/usr/lib/systemd/system/docker.service; enabled; preset: enabled)
     Active: active (running) since Wed 2026-05-13 20:00:35 CST; 1 week 1 day ago
TriggeredBy: ● docker.socket
       Docs: https://docs.docker.com
   Main PID: 755791 (dockerd)
      Tasks: 154
     Memory: 1.3G (peak: 2.5G)
        CPU: 17min 28.568s
     CGroup: /system.slice/docker.service

3.2 检查Docker版本

检查Docker版本

代码语言:bash
复制
root@jeven:~# docker -v
Docker version 28.5.0, build 887030f

3.3 检查docker compose 版本

检查Docker compose版本,确保2.0以上版本。

代码语言:bash
复制
root@jeven:~# docker compose version
Docker Compose version v2.39.4

四、拉取VCompose镜像

下载VCompose镜像,执行以下命令:

代码语言:bash:
复制
root@jeven:~# docker pull ghcr.io/zbrave/vcompose:be6c093
be6c093: Pulling from zbrave/vcompose
589002ba0eae: Already exists
8892f80f46a0: Pull complete
91d1c9c22f2c: Pull complete
cf1159c696ee: Pull complete
3f4ad4352d4f: Pull complete
c2bd5ab17727: Pull complete
4d9d41f3822d: Pull complete
3370263bc02a: Pull complete
07b4536242a3: Pull complete
2ea2c0ff0e06: Pull complete
Digest: sha256:281802dfaedeb29bd9a905460b6ca7e3db89fe36bc1e02b7fbe3097b287e9fb8
Status: Downloaded newer image for ghcr.io/zbrave/vcompose:be6c093
ghcr.io/zbrave/vcompose:be6c093
在这里插入图片描述
在这里插入图片描述

五、部署VCompose服务

5.1 创建部署目录

  • 创建部署目录
代码语言:bash
复制
mkdir -p /data/vcompose  && cd /data/vcompose

5.2 docker-cli方式部署(可选)

如果想要使用docker-cli方式部署,可参考以下命令部署。(可选)

代码语言:bash
复制
docker run -d \
  --name=vcompose \
  --restart=unless-stopped \
  -p 9900:80 \
 ghcr.io/zbrave/vcompose:be6c093

5.3 创建VCompose容器

本次实践我们采用 Docker Compose 方式进行部署,这也是我推荐的方式。首先我们需要创建并编辑 docker-compose.yaml 文件,请注意宿主机映射端口可根据您的实际情况自行设置,务必避免端口冲突。

代码语言:bash
复制
vim docker-compose.yaml
代码语言:yaml
复制
version: '3'

services:
  vcompose:
    image: ghcr.io/zbrave/vcompose:be6c093
    container_name: vcompose
    restart: always
    ports:
      - "9900:80"

执行以下命令,创建VCompose容器。

代码语言:bash
复制
docker compose up -d
在这里插入图片描述
在这里插入图片描述

5.4 查看VCompose容器状态

检查VCompose容器运行状态,确保VCompose容器正常启动。

代码语言:bash
复制
root@jeven:/data/vcompose#  docker compose ps
WARN[0000] /data/vcompose/docker-compose.yaml: the attribute `version` is obsolete, it will be ignored, please remove it to avoid potential confusion
NAME       IMAGE                             COMMAND                   SERVICE    CREATED          STATUS          PORTS
vcompose   ghcr.io/zbrave/vcompose:be6c093   "/docker-entrypoint.…"   vcompose   27 seconds ago   Up 27 seconds   0.0.0.0:9900->80/tcp, [::]:9900->80/tcp
在这里插入图片描述
在这里插入图片描述

5.5 检查VCompose容器日志

检查容器运行日志,确保VCompose服务正常运行。

代码语言:bash
复制
docker compose logs
在这里插入图片描述
在这里插入图片描述

六、访问VCompose服务

6.1 访问VCompose初始页

浏览器地址: http://<个人的服务器IP>:9900,访问VCompose初始页。如果无法访问,请确保宿主机的防火墙已关闭或已放行相关端口,对于云服务器还需配置相应的安全组规则。

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

6.2 进入VCompose首页

点击初始页最下方的【Open VCompose】选项,进入VCompose首页。

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

点击左侧的 Smart Home 示例,即可查看对应的 docker-compose.yaml 文件内容及其服务拓扑关系图。

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

七、总结

通过本次实践,我们成功在 Docker 环境下部署了可视化 Docker Compose 管理工具 VCompose。整个部署过程清晰明了,从环境检查、镜像拉取到容器编排,每一步都配有详细的命令和截图,便于读者复现。VCompose 以其直观的可视化画布、智能的 AI 生成和便捷的 YAML 反向导入功能,显著提升了 Docker Compose 配置的编写与管理效率。无论是个人学习还是团队协作,VCompose 都是一款值得尝试的现代化容器编排辅助工具。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

目录
  • 一、VCompose介绍
    • 1.1 VCompose简介
    • 1.2 VCompose核心特点
  • 二、本次实践规划
    • 2.1 本地环境规划
    • 2.2 本次实践介绍
  • 三、本地环境检查
    • 3.1 检查Docker服务状态
    • 3.2 检查Docker版本
    • 3.3 检查docker compose 版本
  • 四、拉取VCompose镜像
  • 五、部署VCompose服务
    • 5.1 创建部署目录
    • 5.2 docker-cli方式部署(可选)
    • 5.3 创建VCompose容器
    • 5.4 查看VCompose容器状态
    • 5.5 检查VCompose容器日志
  • 六、访问VCompose服务
    • 6.1 访问VCompose初始页
    • 6.2 进入VCompose首页
  • 七、总结
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档