- 博客(47)
- 资源 (1)
- 收藏
- 关注
RSS订阅
原创 【Mxgraph】Vue中使用mxgraph开发流程图工具
1.什么是mxgraphmxGraph是一个JavaScript图表库，可以快速创建交互式图形和图表应用程序，这些应用程序可以在其供应商支持的任何主要浏览器中运行。mxGraph 提供图形绘制、图形可视化、图形交互、图形布局、图形分析等能力， 适用于工作流程图、BPMN图、网络图、UML图、循环图、组织结构图、MindMap图、机架图、甘特图、信息图、平面图等绘制。mxGraph在2005年创建，作为商业项目一直持续到2016年，2016年创建者以Apache 2.0开源协议在GitHub上公布源码。
2021-03-11 16:30:30
30642
33
原创 【xlsx-chart】Vue项目中导出Excel表格并带上图表
基于xlsx-chart开发excel导出表格数据带图表的功能,及简单的拓展
2020-12-22 09:39:08
7130
5
原创 【微前端入门】:从single-spa到qiankun
一、关于微前端1.What?什么是微前端?微前端就是将不同的功能按照不同的维度拆分成多个子应用。通过主应用来加载这些子应 用。微前端的核心在于拆, 拆完后在合!2.Why?为什么去使用他?不同团队间开发同一个应用技术栈不同怎么破？ 希望每个团队都可以独立开发，独立部署怎么破？ 项目中还需要老的应用代码怎么破？我们可以将一个应用划分成若干个子应用，将子应用打包成一个个的lib。当路径切换 时加载不同的子应用。这样每个子应用都是独立的，技术栈也不用做限制了！从而解决了前 端协同开发问题3.How
2020-09-27 17:33:58
5271
2
原创 【D3.js】使用D3.js快速实现拓扑图的绘制
D3的简介D3 全名为 Data Drive Document，即通过 Data 操作 Document，而在做数据可视化时，Data 最常 Drive 的 Document 便是 SVG。刚了解到D3时,看到D3官网非常丰富且酷炫的Demo,便觉得 D3 应该有着无限可能的图形开发能力,所以在学习完基础的API和SVG的基础后,就开始着手绘制D3的节点拓扑图了;绘制简易的可拖拽节点拓扑图2.1 准备工作:安装D3:npm install d3 --save项目中导入D3:imp.
2020-06-21 13:13:58
18239
3
原创 【Jsplumb】Jsplumb基础教程(vue+jsplumb+d3)
目前github社区存在几款可用于设计流程图的绘图框架:go.js( http://www.gojs.net/latest/index.html) :go.js 提供一整套的JS工具 ，支持各种交互式图表的创建；目前go.js 是闭源收费的jsPlumb（https://jsplumbtoolkit.com/): jsPlumb是一套开源的流程图创建工具 ，小巧精悍，使用简单；jsPlumb 有社区版跟收费版，我们可使用的是社区版JointJS(https://www.jointjs.com/)
2020-06-20 23:37:20
68615
13
原创 AI 写代码越快，越要先给它装上刹车
《AI编程时代需要Spec-Driven Development（SDD）吗？》摘要：在AI编程时代，SDD的核心价值并非多写文档，而是为AI建立协作约束，防止其擅自填补工程空白。传统文档常因脱离工作流失效，真正的SDD要让需求规格成为后续开发、验证和评审的契约依据。文章提出轻量级SDD方案，通过分层约束（如需求对齐、行为锁定、根因确认等）控制AI常见的6种失控场景，并介绍工具集dev-skills的11个关键检查点。AI编程的核心矛盾不在于生成能力，而在于如何建立工程约束体系，使AI的快速生成转化为可控生
2026-06-12 17:19:10
217
原创 为什么 AI 写完代码后，不能直接 commit
AI生成代码后提交前的危险时刻：隐蔽的无关改动与半截实现可能混入代码库，而dev-code-review作为工程协作技能链的最后一道防线，专注于在提交前审查diff的规范性、功能性、闭环性、注释质量和废码残留。它通过五个轴的严格审查（规范、功能、闭环、注释、废码），输出明确的三种结果（READY、FIX P1、BLOCK），确保每次提交都清晰、完整且安全，避免AI自我批准带来的潜在风险。
2026-06-11 09:29:32
330
原创 别被“已修复”骗了：AI 修 bug 最该追问这一句
摘要：文章介绍了AI编程工作流规则集dev-skills中的dev-fix方法，旨在解决AI修复bug时过于表面化的问题。dev-fix强调稳定复现bug、建立可证伪的假设、追溯根因、避免夹带重构，并通过回归测试验证修复有效性。该方法防止AI仅掩盖症状而非真正解决问题，确保修复质量与工程可信度。
2026-06-10 09:55:18
338
原创 从需求到 commit：一套更稳的 AI 编程工作流
AI编程工作流：从需求到安全提交的关键路径 摘要： AI编程工具虽然能快速生成代码，但直接让AI从模糊需求跳到代码提交（commit）存在风险。本文提出一套结构化工作流：1）将需求转化为明确契约（dev-grill-docs），锁定问题范围与验收标准；2）复杂需求先评估方案（dev-plan），避免技术路径错误；3）通过测试驱动开发（dev-tdd）锁定核心行为；4）要求AI提供验证证据（dev-verify）而非口头确认；5）提交前进行代码审查（dev-code-review）确保改动质量。该流程根据任务
2026-06-09 13:53:15
197
原创 AI 越会写代码，越不能让它直接写到 commit
《AI编程的11道交付关卡：从生成代码到工程证据链》 文章指出当前AI编程存在"响应过快但交付失控"的核心问题。作者通过拆解人类开发者的工作习惯，设计了11道针对性关卡，将AI编程从单纯的代码生成转变为可验证的工程证据链。关键关卡包括：需求拷问（防止模糊需求）、行为锁定（TDD验证）、根因分析（避免症状修复）、提交前审查等。这些关卡并非线性流程，而是根据不同场景（新功能开发/BUG修复/热修复）灵活组合使用。核心价值在于：将AI的快速响应能力与工程严谨性结合，通过结构化流程控制风险，使每次交付不再依赖运气，
2026-06-08 14:05:12
355
原创 AI 编程最危险的瞬间：它还没听懂，就已经开始写了
AI编程的潜在危险：速度掩盖了理解偏差 摘要：AI编程工具虽然能快速生成代码，但其最危险之处在于经常在未充分理解需求前就开始编写。这种"盲快"会导致：(1)AI倾向于填补需求空白而非确认细节，生成看似合理但偏离需求的代码；(2)将"代码生成"误认为"问题解决"，缺乏必要验证；(3)仅修复表面症状而非根本原因。有效的AI协作需要建立明确的工程协议：先确认需求边界、复现问题根源、验证解决方案，而非单纯追求速度。关键在于让AI先理解后执行，而非盲目生成代码。
2026-06-06 19:31:41
229
原创 RTK Token 提效改造指南
RTK命令路由优化指南：针对Flutter/Dart/Melos命令的token节省策略。当RTK统计显示token节省率低时，可能是由于某些命令未配置有效压缩路径。建议根据输出类型选择特定RTK包装器：测试命令用rtk test，错误输出用rtk err，长日志用rtk summary。全局agent规则应优先使用最具体的RTK包装器，并为Flutter/Dart/Melos命令配置默认路由（如rtk test flutter test...）。通过rtk hook check命令可验证当前路由配置情况。
2026-05-29 10:00:00
36
原创 面向 Agent 工作流的 Token 节省方案
本文探讨了AI编程中上下文噪声带来的成本问题，指出真正昂贵的不是命令执行本身，而是无关内容（如构建日志、搜索结果、重复警告等）挤占上下文空间。文章提出三套过滤工具：RTK（命令行降噪）、CodeGraph（代码结构导航）和Semble（语义搜索优化），它们分别在命令输出、代码结构和业务语义三个入口拦截噪声。重点介绍了RTK的工作原理，它通过前置过滤命令输出（如压缩git日志、聚合测试错误），可节省78%的token消耗，并提供数据统计功能验证节省效果。这些工具共同目标是让AI像熟练工程师一样精准定位问题，而
2026-05-28 11:56:29
415
原创 【Flutter】深入理解 Provider：不仅仅是Consumer
Flutter 的 provider 状态管理方案提供了完整的工具链，包括多种 Provider 类型（基础 Provider、ChangeNotifierProvider 等）、状态读取方式（context.read/watch/select）和监听组件（Consumer、Selector）。它支持静态数据、异步数据（FutureProvider/StreamProvider）和依赖注入（ProxyProvider），通过精细控制监听范围（如 Selector 监听字段级变化）来优化性能。最佳实践包括区分
2025-07-18 10:40:08
1242
原创 【Flutter】解决 flutter_inappwebview在 Windows 上使用导致应用闪退问题
原生依赖问题：Flutter 桌面应用依赖原生库，需要确保运行环境完整安装包集成：通过安装脚本自动处理依赖安装日志记录：完善的错误日志有助于问题定位和解决。
2025-06-28 15:05:45
1567
原创 【Flutter】异常捕获天罗地网：让你的 App 稳如泰山！
作为 Flutter 开发者，应用的稳定性直接关系到用户体验和产品的成功。未捕获的异常是导致应用崩溃、用户流失的常见原因。为了帮助大家构建更加健壮的应用程序，本文将深入探讨 Flutter 中的异常捕获机制与最佳实践，编织一张高效的"防护网"，从容应对各种错误。
2025-05-28 23:39:02
1223
原创 【Git】reflog实战：找回丢失的提交
某天，程序员小陈哼着歌敲代码，突然遭遇灵异事件——刚写的两个重要commit凭空消失了！原来他执行了git pull --rebase后，本地最新提交不翼而飞。别慌！跟着我们的"Git时光机"（reflog）来场代码救援行动吧！
2025-02-17 23:00:10
1514
原创 【Git】如何在 Git 提交后补充 Change-Id
在使用 Git 进行版本控制时，Change-Id 是与代码审查工具（如 Gerrit）集成时所需要的一个标识符。它通常自动生成并包含在提交信息中，用于标识每次提交。很多时候，如果没有配置相应的工具，提交信息中可能会缺少 Change-Id，这时你可以手动补充它。
2025-01-24 16:32:45
2502
原创 【Git 】探索 Git 的魔法——git am 与补丁文件的故事
git am 是 Git 中的一个命令，用于应用邮件格式的补丁文件。它不仅能将补丁中的代码改动整合到当前分支，还会保留原始的提交记录，包括作者信息、时间戳和提交信息。
2025-01-16 10:04:16
1242
原创 【AI】AI原生应用场景调研
AI原生（AI Native）是一种基于AI构建和运行应用程序的方法，是一套技术体系和方法论；在AI原生应用中，它以AI为核心，包括数据收集和处理、模型训练和优化、模型部署和管理等方面，将AI的能力贯穿于整个应用架构中。AI原生应用中的AI是产品的核心部分，如果没有AI，产品的功能形态的核心流程就不存在；
2024-03-20 09:55:45
1388
1
原创 【Nginx】CentOS 安装Nignx
这就是在CentOS上安装Nginx的基本步骤。安装完成后，您可以根据需要对Nginx的配置文件进行自定义，以满足您的特定需求。如果您想更详细地配置Nginx，可以编辑。如果报错 FirewallD is not running，请启动FirewallD。默认情况下，Nginx的配置文件位于。目录中创建自定义配置文件。
2023-11-14 10:49:29
651
原创 【JMeter】前端使用JMeter测试JSEncrypt加密登录
前端开发时会接触到用户登录，登录时为了数据的安全会使用到jsencrypt加密工具进行RSA加密，同时我们需要使用jmeter来进行压测，帮助我们了解Web应用程序在高负载情况下的性能表现，从而为优化应用程序性能提供参考。
2023-05-09 11:22:20
4321
原创 【Gerrit】正确添加了SSh key 仍报错 Permission denied (publickey). fatal: Could not read from remote repository
当我们在部署新的开发环境时在使用Gerrit clone代码的时候，你会发现报错，错误信息大概是：Permission denied (publickey). fatal: Could not read from remote repository.OpenSSH从8.8版本开始由于安全原因开始弃用了rsa加密的密钥。因为OpenSSH认为rsa破解成本太小了，有风险就给禁用了。你可以通过命令：如：去查看Gerrit服务器的OpenSSH的版本号，如果≥8.8，就可以用这个方法。可以使用ed2
2023-03-29 09:44:35
7607
7
原创 【D3.js】基础教程
D3: Data-Driven DocumentsD3 (或D3.js)是一个JavaScript库，用于使用Web标准可视化数据。 D3帮助您使用SVG，Canvas和HTML使数据栩栩如生。 D3将强大的可视化和交互技术与数据驱动的DOM操作方法相结合，为您提供现代浏览器的全部功能，并为您的数据设计正确的可视界面提供了自由。官方资源API ReferenceRelease NotesGalleryExamplesWiki安装D3npm安装安装命令npm install d3;
2023-01-12 17:47:43
22101
1
原创 【uni-app】uni-app安装scss/sass后报错：win32-x64-64_binding.node is not a valid Win32 application
当我们下载HbuilderX编辑器，安装scss/sass编译插件时，报错：现象：这段信息告诉我们，我当时开发环境安装的node-sass中win32-ia32-72目录下binding.node这个文件丢失，需要下载补充或：\HBuilderX\plugins\compile-node-sass\node_modules\node-sass-china\vendor\win32-ia32-72\binding.node is not a valid Win32 application.这段信
2021-11-26 17:24:10
5199
2
原创 【PDF在线预览】Vue/ReactPDF简易在线预览
【Vue/React】PDF在线预览工具：pdfjs-dist@2.0.943代码：html: <div id="pageContainer"> <div id="viewer" class="pdfViewer"></div> </div>js:import pdfjsLib from "pdfjs-dist/build/pdf";import { PDFViewer } from "pdfjs-dist/web/pdf_vie
2021-11-22 19:55:41
903
原创 【Element】element-ui级联选择器(多选)点击label文字选择当前项
element-ui级联选择器(多选)点击label文字选择当前项.el-cascader-panel .el-scrollbar.el-cascader-menu:nth-child(n + 2) .el-checkbox{ width: 100%; height: 100%; z-index: 10; position: absolute; top: -1px; right: -14px;}.el-cascader-panel .el-scrol
2021-11-07 12:19:58
1336
原创 【React】脚手架配置代理
React脚手架配置代理总结方法一在package.json中追加如下配置"proxy":"http://localhost:5000"说明：优点：配置简单，前端请求资源时可以不加任何前缀。缺点：不能配置多个代理。工作方式：上述方式配置代理，当请求了3000不存在的资源时，那么该请求会转发给5000 （优先匹配前端资源）方法二第一步：创建代理配置文件在src下创建配置文件：src/setupProxy.js编写setupProxy.js配置具体代理规则：const
2021-10-17 15:57:10
248
原创 【前端通讯】WebSocket和EventSource实践
WebSocket: this.socket = DashboardService.getWsPermissionEvent(); this.socket.onopen = (e) => { console.log('-------websocket channel opened-------'); }; // 监听socket错误信息 this.socket.onerror = (e) => { console.
2021-09-17 10:12:48
1052
原创 【JavaScript 】注释相关
1.单行注释 快捷键 : ctrl+ /2.多行注释 快捷键 : alt + shift + a3.JSDoc 注释规则 快捷键 : 依次输入 / * *JSDoc注释一般应该放置在方法或函数声明之前，它必须以/ **开始，以便由JSDoc解析器识别。其他任何以/*，/***或者超过3个星号的注释，都将被JSDoc解析器忽略。如下所示：/*** 一段简单的 JSDoc 注释。*/JSDoc 的注释效果假如我们有一段这样的代码
2021-09-16 15:46:59
2041
1
原创 【JsPlumb】基于JsPlumb设计的Web拓扑图编辑器
Easy editor项目介绍Easy Editor 是基于 VUE+ElementUI+JsPlumb 的拓扑编辑器，通过该编辑器你可以实现拓扑图绘制,拓扑图的修改等功能节点拖拽功能实现流程通过 vuedraggable 插件来实现左侧菜单的拖拽，拖拽结束后回调 end 方法,根据鼠标所在的位置添加一个节点信息，使用 jsplumb 来管理该节点，设置该节点可拖拽、连线 并注册相关的事件。效果图功能支持拖拽添加节点鼠标移入到节点中显示 编辑、删除 操作鼠标单击线可进行设置条件,双击可
2021-09-14 09:59:10
2317
1
原创 【微前端实践】webpack5 + Node.js+ Nacos 搭建微前端应用网络
一、关于Nacos什么是Nacos?官方介绍https://nacos.io/zh-cn/docs/what-is-nacos.htmlNacos 致力于帮助您发现、配置和管理微服务。Nacos 提供了一组简单易用的特性集，帮助您快速实现动态服务发现、服务配置、服务元数据及流量管理。Nacos 帮助您更敏捷和容易地构建、交付和管理微服务平台。 Nacos 是构建以“服务”为中心的现代应用架构 (例如微服务范式、云原生范式) 的服务基础设施。简单概括一下Nacos可以做两方面用途：配置服务中心
2021-09-07 18:28:49
8666
2
原创 【微前端】webpack 5 模块联邦实践
背景前端应用、微服务的发展，使得模块化的概念越来越重要。 这也不可避免的会产生再不同的项目会有很多功能相似，甚至完全相同。所以跨应用的代码共享尤为重要，之前我们处理这种问题往往采用，1、功能相似的页面直接赋值方便，不用费脑力直接复用。但这样就会导致项目中代码的复用性低，代码冗余多等问题出现。2、微服务的出现，很多业务一般使用npm 发布的形式管理公共包。我们EDSP前端项目也是用了npm插件形式;但在使用下来我们发现npm 比较适合对业务逻辑耦合小，完全工具类的包。而对于业务逻辑比较繁重，更新频繁的模
2021-08-26 17:55:37
3678
4
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人