npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

mysql-dashboard

v0.2.0

Published

Web-based MySQL database management tool (f2e-server3)

Readme

MySQL Dashboard

基于 Web 的 MySQL 图形化管理工具,沿用 mongo-dashboard 的技术栈(f2e-server3 + React + Ant Design + Tailwind)。

快速启动

cd mysql-dashboard
npm install
npm run dev

默认开发端口为 7018(与 mongo-dashboard 的 7017 错开)。浏览器访问控制台输出的地址即可。

生产环境可先构建再启动:

npm run build
npm start

也可全局安装后使用命令行(默认端口同样可通过 -p 指定):

npm install -g mysql-dashboard
mysql-dashboard -m prod -p 7018

界面与导航

  • 连接:首页 / 管理已保存连接(增删改、测试连通性)。连接字段包含名称、主机、端口、用户名、密码、可选默认库,以及 JDBC 风格的 mysql://... 连接串(connectionString)。
  • 数据库/connection/:connectionId 列出库及估算占用,支持创建 / 重命名(将旧库下全部表 RENAME TABLE 迁至新库后删除旧库)/ 删除。系统库仅可查看,不可删除或重命名。
  • 数据表/connection/:connectionId/database/:databaseName 列出当前库下的基表(information_schema),支持新建表、重命名、删除;可编辑表结构(新增列、修改列属性或重命名列、删除列)。新建表时若不指定列,则创建带 INT AUTO_INCREMENT PRIMARY KEY 的空表;也可按向导定义多列后创建。
  • 表数据与查询/connection/:connectionId/database/:databaseName/collection/:collectionName 分页浏览行数据、列显示设置、按 JSON 编辑行(需主键)、删除行(需主键),并打开「自定义查询」面板。

顶部可切换浅色 / 深色主题;帮助菜单中可打开本页(帮助手册)与开发手册。

功能概览

连接管理

  • 列表、创建、更新、删除、连接测试。
  • 配置持久保存在项目目录 .f2e_cache/mysql-connection.json(由 f2e-server3 的 DBFile 维护)。

数据库

  • 列表与占用估算(information_schema)。
  • 创建、删除;重命名通过建新库并迁移全部表实现。
  • 系统库 mysqlinformation_schemaperformance_schemasys:禁止删除、重命名,且其下不允许建表、改表、行级写入等变更操作;只读浏览不受影响。

数据表

  • 列表展示近似行数、数据量与索引量等(TABLE_ROWS 等为估计值)。
  • 新建(默认单列自增主键表或自定义列)、重命名、删除。
  • 表结构:查看列类型、可空、键、默认值、EXTRA、注释等;在允许的库中可 ALTERADD / MODIFY(含列重命名)/ DROP COLUMN

数据行

  • 分页列表;可配置列显示。
  • 每行附带内部字段 __pk(主键列快照),用于定位更新与删除;无主键的表仅支持浏览,不提供行更新 / 删除。
  • 使用「自定义查询」返回的结果若来自非标准列表路径,可能缺少完整 __pk,界面会提示此时行编辑 / 删除可能不可用。

查询(自定义查询面板)

| 操作 | 说明 | |------|------| | find | 等值条件 JSON(键为列名,合法标识符),WHEREAND 连接;空对象 {} 表示无额外条件;最多返回 100 行。 | | findOne | 同上,最多 1 行。 | | count | 同上,返回匹配行数。 | | aggregate(界面文案为自定义 SELECT) | 仅限以 SELECT 开头的语句;禁止 INTOOUTFILEDUMPFILEFOR UPDATE 等关键字。 | | insertOne | 提供 JSON 对象,键为列名、值为单元格值,执行 INSERT;系统库与非只读模式下策略与表详情页一致。 |

等值条件中的键名仅允许字母、数字、下划线(与后端拼装一致)。

环境要求

  • Node.js >= 18
  • 可访问的 MySQL 5.7+ / 8.x 实例

应用内帮助

构建后的站点中,通过顶部 帮助 → 帮助手册 / 开发手册 可阅读本仓库的 README.mdDEVELOPMENT.md(路由 /help/readme/help/development)。

安全提示

本工具面向可信网络下的管理与排障场景。自定义 SELECT 与连接账号权限请自行约束;勿将高权限账号暴露在公网。