基于 draw.io 的二次开发及 Docker 镜像构建部署实战

2025-06-17阅读(132)评论(0)牵着狗狗看MM

苏州实时公交查询

在实际业务中,往往需要对开源项目如 draw.io 进行定制化开发。本文将详细介绍如何基于 fork 下来的 draw.io 项目进行二次开发,并将其打包为 .war 文件,最终构建成 Docker 镜像供生产环境使用。

注意:drawio的本身源码并不开源,只能进行一些简单的定制化开发,比如修改加载页的英文改成中文等

一、准备工作

1. Fork 并克隆源码

首先从 GitHub fork 官方仓库或使用自建仓库:

git clone https://git.henglink.com/henglifrontteam/drawio.git

注意:fork 下来的 .git/objects 文件夹可能非常大(>1.5GB),请勿将其包含在部署或中间打包过程中,以免构建异常或占用过多资源。

 

二、Ant 构建环境配置(用于打包 .war 文件)

1. 下载 Ant

访问 Apache Ant 官网 下载并解压。

2. 配置环境变量(以 Windows 为例)

新建系统变量

变量名:ANT_HOME
变量值:ant的解压目录

修改 Path 环境变量,添加:

%ANT_HOME%\bin

验证:

打开命令行,执行:

ant

若输出如下信息,则说明配置成功:

Buildfile: build.xml does not exist!
Build failed

 

三、打包 draw.io 为 .war

进入 drawio/etc/build 目录,执行打包命令:

ant war

打包成功后,会在 build 目录下生成 draw.war 文件。

 

四、构建自定义 Docker 镜像

我们将使用 docker-drawio 的框架进行修改,目的是使用我们自己打包好的 draw.war 文件,而非再从 GitHub 拉取。

1. 修改 Dockerfile

docker-drawio/main/Dockerfile 中,修改如下部分:

# 注释或移除如下代码
# RUN cd /tmp && \
#     git clone --depth 1 https://github.com/jgraph/drawio.git && \
#     cd /tmp/drawio/etc/build/ && \
#     ant war


# 使用本地打包好的 draw.war,注释如下代码并新增代码
#COPY --from=build /tmp/drawio/build/draw.war /tmp
COPY draw.war /tmp/draw.war

确保你将 draw.war 拷贝到 main/ 目录中。

2. 构建 Docker 镜像

main/ 目录下执行:

docker build -t drawio .

构建成功后,会生成名为 drawio 的本地镜像。

 

五、启动容器

docker run -it --rm --name="draw" -p 8080:8080 -p 8443:8443 drawio

 

六、访问项目

浏览器打开http://localhost:8080 即可看到修改后的内容

赞(0)
转载请注明来源:Web前端(W3Cways.com) - Web前端学习之路 » 基于 draw.io 的二次开发及 Docker 镜像构建部署实战
分享到: 更多 (0)