Superset项目开发指南：从文档维护到可视化插件开发

最新推荐文章于 2025-05-30 09:04:19 发布

薛烈珑Una

最新推荐文章于 2025-05-30 09:04:19 发布

阅读量315

点赞数 4

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/gitblog_00400/article/details/148323844

Superset项目开发指南：从文档维护到可视化插件开发

superset 项目地址: https://gitcode.com/gh_mirrors/su/superset

文档开发与维护

Superset项目的文档系统基于Docusaurus 3构建，这是一个现代化的静态网站生成器。文档开发环境搭建十分便捷：

环境准备：进入项目文档目录，安装依赖并启动开发服务器

cd docs
yarn install
yarn start

开发服务器启动后，可通过本地3000端口实时预览文档变更。

生产构建：完成文档修改后，可生成生产环境构建包

yarn build
yarn serve

文档变更提交到主分支后会自动触发构建和部署流程。建议文档相关的提交使用docs:前缀，便于识别。

可视化插件开发实战

Superset的可视化功能通过插件机制实现，开发者可以创建自定义图表类型。以下是开发一个"Hello World"图表的完整流程：

开发环境准备

操作系统：推荐MacOS或Linux
Node.js 16环境
npm 7或8版本
React基础知识

初始化插件项目

安装Superset Yeoman生成器

npm i -g yo
cd superset-frontend/packages/generator-superset
npm i
npm link

mkdir /tmp/superset-plugin-chart-hello-world
cd /tmp/superset-plugin-chart-hello-world
yo @superset-ui/superset

生成器会交互式询问插件信息，默认选项即可满足基础需求。

插件开发与集成

构建插件：

npm i --force
npm run build  # 生产构建
npm run dev   # 开发模式(热更新)

集成到Superset：

cd superset-frontend
npm i -S /tmp/superset-plugin-chart-hello-world

修改MainPreset.js配置文件：

import { SupersetPluginChartHelloWorld } from 'superset-plugin-chart-hello-world';
// ...
plugins: [
  new SupersetPluginChartHelloWorld().configure({ key: 'ext-hello-world' }),
  // 其他插件...
]

测试策略详解

后端测试

Superset采用pytest框架进行Python代码测试，结合docker-compose环境：

运行所有集成测试：

scripts/tests/run.sh

运行单个单元测试：

pytest ./path/to/test.py

Presto/Trino测试：

docker run -p 15433:15433 starburstdata/presto:350-e.6
export SUPERSET__SQLALCHEMY_EXAMPLES_URI=presto://localhost:15433/memory/default

前端测试

使用Jest和Enzyme进行组件测试：

运行所有前端测试：

cd superset-frontend
npm run test

运行指定测试文件：

npm run test -- path/to/file.js

E2E测试

基于Cypress的完整流程测试：

启动测试环境：

CYPRESS_CONFIG=true docker compose up --build

运行测试：

cd superset-frontend/cypress-base
npm install
npx cypress open --config numTestsKeptInMemory=5  # 交互模式
npm run cypress-run-chrome  # 命令行模式

调试技巧

Flask应用调试

修改docker-compose.yaml添加调试支持：

cap_add:
  - SYS_PTRACE
ports:
  - 5678:5678

容器内安装调试工具：

apt update && apt install -y gdb net-tools
pip install debugpy

附加调试器到Flask进程：

python3 -m debugpy --listen 0.0.0.0:5678 --pid <Flask主进程PID>

VSCode配置远程调试：

{
  "type": "python",
  "request": "attach",
  "connect": {
    "host": "127.0.0.1",
    "port": 5678
  }
}

Kubernetes环境调试

确保Pod具有SYS_PTRACE权限
建立端口转发：

kubectl port-forward pod/<pod-name> 5678:5678

多语言支持

Superset使用Flask-Babel实现国际化：

启用语言选择：在superset_config.py中添加：

LANGUAGES = {
    'en': {'flag': 'us', 'name': 'English'},
    'zh': {'flag': 'cn', 'name': 'Chinese'},
}

翻译流程：

提取字符串：./scripts/translations/babel_update.sh
更新PO文件：pybabel update -i messages.pot -d translations
使用Poedit等工具翻译
编译前端翻译：npm run build-translation

代码中的翻译标记：

Python: from flask_babel import lazy_gettext as _
JavaScript: import { t } from "@superset-ui/translation"

通过这套完整的开发工具链，开发者可以高效地参与Superset项目的功能开发、问题修复和国际化支持。

superset 项目地址: https://gitcode.com/gh_mirrors/su/superset

创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考