PassNAT LogoPassNAT

免费自建思维导图!Simple Mind Map Docker 部署教程。无公网设置帕斯内网穿透在线访问!

作者

小编

发布时间

Curving abstract shapes with an orange and blue gradient

项目介绍

思绪思维导图(Simple Mind Map)是一个简单而强大的 Web 思维导图库和在线思维导图应用。它基于 Vue2.x + ElementUI + TypeScript 构建,提供了丰富的思维导图功能,支持多种图形结构、主题定制、节点编辑、导入导出等功能。

该项目采用插件化架构,除核心功能外,其他功能作为插件提供,可按需使用。支持逻辑结构图、思维导图、组织结构图、目录组织图、时间轴、鱼骨图等多种结构。节点内容支持文本、图片、图标、超链接、备注、标签、概要、数学公式等丰富内容。

界面美观易用,功能强大,可以满足个人和企业的思维导图需求。项目完全开源,支持自部署和二次开发,让你拥有完全的数据控制权。

项目地址: 点我跳转

部署安装

如需在外也打开项目需要配置内网穿透使用,点击前往 帕斯内网穿透,先注册好账号备用。

由于该项目没有提供官方 Docker 镜像,我们需要手动构建。最简单的方式是使用 Node.js 环境运行项目。

打开飞牛 NAS 或其他的 NAS 设备 点击本地镜像-添加镜像-从 URL 添加。这一步先添加 Node.js 镜像

镜像填 node:18-alpine 等待下载完成后点击启动按钮启动容器

勾选开机自动启动后下一步,端口设置这里。请设置容器内端口 8080,主机端口可以设置为 8080(如果端口冲突可以修改主机端口,比如改为 8081,但容器内端口必须保持 8080

存储位置这里,需要创建一个文件夹用于存放项目代码。建议在 NAS 上创建 /docker/mind-map 文件夹,然后映射到容器的 /app 目录。

环境变量设置:可选设置 - NODE_ENV: 设置为 production(生产环境) - PORT: 设置为 8080(应用端口)

其他的都不用填写,直接下一步。

启动容器后,需要进入容器执行以下命令安装和运行项目:

1# 进入容器
2docker exec -it [容器名称] /bin/sh
3
4# 克隆项目
5cd /app
6git clone https://github.com/wanglin2/mind-map.git .
7
8# 进入 web 目录
9cd web
10
11# 安装依赖
12npm install
13
14# 构建项目
15npm run build
16
17# 安装 serve 用于提供静态文件服务
18npm install -g serve
19
20# 启动服务
21serve -s dist -l 8080

创建成功后可以访问 ip:8080(按照你设置的端口访问) 到这里就可以正常显示思维导图应用了

穿透公网

打开帕斯内网穿透控制台,点击隧道管理-隧道列表

点击创建新隧道

隧道节点可以随便选,一般选个负载低的就可以

接下来填写信息,隧道名称可以随便填写

本地 IP 默认就可以

传输协议可以选择 TCP 也可以选择 HTTP/HTTPS

HTTP 就是域名的形式,教程以使用 TCP 为演示

本项目中如果没有修改端口的话默认是 8080 端口,这里本地端口就填 8080

远程端口可以留空也可以自定义。

填写完毕点击确定

点击刚才创建好的隧道,点击获取配置文件

回到飞牛 NAS,点击应用中心下载 frpc 客户端

打开后粘贴刚才复制的配置文件,点击确定即可

复制帕斯内网穿透控制台的访问 IP 和端口

可以看到已经正常穿透成功了

本篇教程结束