作者： Miss yy，曾就职于凤凰网、京东科技等大厂。擅长 Node.js、Web前端开发、后端开发、运维、测试等技术领域，有丰富且广泛的开发经验。

初识FlyFish

由于我当前所在公司团队业务不断发展，因此需要开发出一个通过拖拉拽这种简单的配置方式就能生成页面、应用，甚至系统的低代码平台。然而，由于公司已有业务非常繁忙，团队开发人员根本无法抽出更多的时间来接手新的需求，因此，寻找一个合适的开源低代码平台便成为了我们新的探索方向。

一个偶然的机会，我与身边的朋友聊起了当前低代码技术的发展情况以及我们公司对低代码平台需求情况。朋友兴致勃勃与我讲了低代码相关的一些情况，并表示现在低代码技术已经发展的相当成熟了，很多开源项目就可以满足我们公司的需求，比如“飞鱼（FlyFish）”。当时是我第一次了解到飞鱼，但是经过朋友的介绍，我发现飞鱼与我们公司当前的需求非常契合。

使用FlyFish

第一次使用飞鱼时，我先是详细了解并查看了飞鱼的技术文档与部署教程。飞鱼的部署文档说明非常详细，尤其是一键部署脚本，对新手非常友好，轻轻松松就可以快速完成部署。然而，由于我们公司只有内网没有互联网，所以没有办法通过仅限于有互联网访问权限，且服务器比较干净的系统才可以使用一键部署功能的来部署飞鱼，所以我最后选择了手动安装部署。在手动部署操作过程中，我们公司的运维同事通过飞鱼提供的部署文档以及NPM相资源，仅仅用了一下午时间，就被告知8089已经可以访问了，这对于我们来说真的很惊喜。

本地部署成功后，我便开始了大屏制作。然而，在大屏完成后的初步导出应用时我发现背景图片竟然没有生效。此时我在飞鱼开发者群内进行了咨询，官方开发者给出了我以下两种解决方案：

方案一：手动删除导出的zip包中背景图片错误路径。

修改导出的下方飞鱼大屏源码配置，删除backgroundImage以及image中多出的www路径即可。

config/env.conf.json

方案二：在 飞鱼 lcapServer 目录内执行以下命令

vim ./config/config.development.js（大约在84行）

并将：

applicationPath: commonDirPath ? `${commonDirPath}/applications` : 'applications',

修改为：

applicationPath: 'applications',

随后，重启lcapServer，在 lcapServer目录内执行以下命令。之后新建的大屏再导出后就不需要手动去掉导出包中的www路径了。

npm run stop
npm run development

经过以上的操作，我终于完成了第一张数据可视化大屏的制作。从飞鱼平台的部署到一张完整数据可视化大屏的诞生，在不断发现问题与解决问题的过程中，我真切地感受到了开源不只是一个人在战斗。

踩坑经验

尽管我轻轻松松地就完成了使用飞鱼的第一步——安装部署操作，但在实际使用过程，还是会有一些大大小小的踩坑经验值得分享。

经验1：飞鱼平台部署成功后，无可用组件

对于一个低代码平台来说，组件是非常重要的。没有组件就意味着无法通过拖拉拽来实现业务需求，也就无法达到降本增效的目的了。

基于这个问题，我快速咨询了飞鱼开发者交流群中的官方开发人员，才知道组件是需要单独依次导入才可以使用的。在此基础上，由于飞鱼（FlyFish）2.2.0版本不兼容FlyFishComponents中的组件，故需要手动修改 FlyFishComponents 中组件的资源路径和组件 ID 为对应的占位符。包含 editor.html、env.js、index.html、options.json、src/main.js、src/setting.js 相关文件修改。

以上文件修改完成后需要将 FlyFishComponents 组件中以上6个文件使用的 ffComp_2.2.0.zip 对应文件全部替换，再导入到 FlyFish2.2.0 平台便可正常使用。替换文件 ffComp_2.2.0.zip，具体操作步骤如下：

替换文件
压缩组件
安装依赖
编译组件（Ctrl+S）
更新上线

方法已掌握，不过30多个常用组件挨个下载、完成文件替换、Zip压缩等操作，工程量还是很大的。此时，我也终于意识到了shell脚本能力的重要性，几行脚本就可以把需要CV(Copy、Paste)半天的工作干完。在 Zip 压缩过程中也有个小插曲，需要注意，Windows下Zip包是不可用的，需要Mac Zip 或者Linux Zip才可以。

经验2：登录飞鱼平台后，进入组件开发页面显示502/404

如下图所示，我在飞鱼部署完成后，进入组件开发页面时，竟然显示502和404了。

这时候，我又马上请教了我们飞鱼项目的官方开发者。经提示，我在服务器执行pm2 ls 时查看了一下 code-server 服务没有启动。随后，我按照 code-server 的启动步骤重新来了一遍，敲完 npm run linux-start，最后按下回车，pm2 ls 看到了下图的 online。

然而，页面刷新后，还是显示502。飞鱼官方开发者让我重新执行了 pm2 ls。然后我发现服务是有问题的，就在这么短的时间内，服务已经重启了167次。如下图所示。

这时，飞鱼官方开发者初步定位是pm2版本有问题或者安装过程中出了问题，让我执行了以下命令重新安装pm2并启动code-server。

cd~
pm2 stop all
npm uninstall -g pm2
rm -rf .pm2
npm install -g pm2
在lcapCodeServer中执行
npm run linux-start

然而，上述操作完成后，code-server启动后还是一直在重启。重启的原因大概率是环境里有pm2的残留文件，以及npm卸载不干净。这时，飞鱼官方开发人员建议我使用sudo npm install pm2 --unsafe-perm --verbose -g进行卸载。以上卸载命令执行后，我重新安装了pm2，启动了code-server，至此，服务终于正常了。然而，当我打开组件开发页面刷新时，502是没有了，但404还在，如下图所示：

在飞鱼官方开发者各种检查环境配置后，终于发现了一个环境路径配置异常，如下图所示。这时仅需将下图红框中的路径替换成对应的服务器真实路径即可。

经验3：前端访问地址更新为域名访问

假如域名地址为：pandora.com.cn

更改 nginx 配置

# 域名为pandora.com.cn
#打开文件/etc/nginx/conf.d/flyfish.conf
#以下三行配置修改成如下内容
listen 80;
server_name pandora.com.cn;
proxy_cookie_domain 0.0.0.0 pandora.com.cn;

更改env-config

#打开文件 /data/app/pandora2/lcapWeb/lcapWeb/conf/env-config.js
#修改hostname fontport,修改后内容如下
const hostname = 'pandora.com.cn';
const fontPort = "80";

重启ngix

nginx -s reload

总结

在整体的部署使用过程中，飞鱼官方开发者真正的做到了快速定位问题、光速解决问题。虽然我仅仅使用的是飞鱼开源版，但是飞鱼官方开发者的响应速度让我甚至觉得自己已经付过费了。

最后，感谢各位的阅读，希望上述的这些经验能有助于解决你们的燃眉问题或者给你们技术方面一点点启发，那将是我莫大的荣幸。

开源福利

如果喜欢我们的项目，请不要忘记点击下方代码仓库地址，在 GitHub / Gitee 仓库上点个 Star，我们需要您的鼓励与支持。此外，即刻参与 FlyFish 项目贡献成为 FlyFish Contributor 的同时更有万元现金等你来拿。

GitHub 地址： https://github.com/CloudWise-OpenSource/FlyFish

Gitee 地址：https://gitee.com/CloudWise/fly-fish

FlyFish贡献指南：http://bbs.aiops.cloudwise.com/d/717-flyfish

FlyFish 模版中心： https://www.cloudwise.ai/flyFishComponents.html

FlyFish开发者说｜开源低代码平台的体验与思考相关推荐

2022年值得选择的开源低代码平台
以下材料均通过互联网收集,排名不分先后,供低代码平台选型参考. 捷码低代码平台杭州远眺科技有限公司成立于2013年,是浙江大学大数据技术领域成果转化基地,也是国内第一家专注于提供面向智慧物联网(AI ...
0成本低代码入门指南，国产化+私有化的开源低代码平台如何获取？
近年来,低代码发展得如火如荼,Gartner的报告显示,低代码或无代码的市场,仅在2021年就增长了25%,分析软件市场也在一年内成长了20%. 低代码来源于英文"Low Cod" ...
速来！0元优质低代码平台抢先体验
0元体验低代码平台速来!重磅大礼包!为回馈老客户,天翎MyApps平台正式上线了会员系统.用户在会员中心(https://mall.teemlink.com/)注册会员之后,只要0元,便可以获取My ...
一款基于Uniapp开发的开源低代码平台
rtvue-lowcode 简介 rtvue-lowcode是一款基于uni-app框架和uview组件库开发的app可视化拖拽项目,适用于企业.个人等基于uni-app技术栈开发的项目.适合各种小程 ...
推荐一个开源低代码开发平台 Corteza
Corteza 低代码开发平台 Corteza低代码开发平台,官网: https://cortezaproject.org/ 截至目前,是我找到的,唯一一个100%免费的开源平台了.我查了将近十多个开 ...
这些低代码平台，你是否知悉？
低代码low-code,无代码no-code,合称LCNC,近年来获得较快发展.低代码和无代码(LCNC)软件应用是当今商业领域最大的技术创新之一.顾名思义,低代码和无代码开发有助于简化开发流程,而不 ...
若依低代码平台（带工作流引擎版本）使用记录
目录 0 平台介绍 1 创建数据库 2 Redis缓存数据库 3 修改配置文件 4 修改maven依赖 5 运行后台 6 运行前端 7 运行效果 0 平台介绍带工作流引擎的开源低代码平台并不常有,这 ...
5个优秀的国产开源低代码开发平台推荐
1.J2PaaS低代码平台 J2PaaS是综合性低代码开发平台,覆盖了软件项目需求分析.设计.开发.测试.运行.维护与管理等全过程.平台为开发者提供开发引擎.运行引擎.项目管理, 打破传统开发用&qu ...
erp5 功能强大的开源免费低代码平台
erp5 功能强大的开源免费低代码平台作为能开发复杂erp的低代码平台,是非常不好做的,odoo/axelor也搞了所谓的在线低代码平台,非常的简陋问题在于 1 首先要做个在线ide,在线ide不 ...

FlyFish开发者说｜开源低代码平台的体验与思考