尧图网站设计 尧图网站设计YAOTU DESIGN
ARTICLE DETAIL

资讯详情

深耕网站设计与一线实操的经验洞察。

Typebot 仓库 Biome 关闭规则迁移计划:从 `biome.json` 的 `off` 到全量 lint 覆盖的分阶段实战方案

Typebot 仓库 Biome 关闭规则迁移计划:从 `biome.json` 的 `off` 到全量 lint 覆盖的分阶段实战方案 Typebot 仓库 Biome 关闭规则迁移计划从biome.json的off到全量 lint 覆盖的分阶段实战方案【免费下载链接】typebot.io Typebot is a powerful chatbot builder that you can self-host.项目地址: https://gitcode.com/GitHub_Trending/ty/typebot.io导读本指南基于 Typebot 仓库根目录下的迁移计划文档 plans/biome-off-rules-plan.md系统讲解如何分批移除 biome.json 中被显式关闭off的 lint 规则并在此过程中把一批诊断数为 0、具备自动修复能力或需要人工调整的规则逐步启用。读者读完后将掌握一套可直接复用的按 PR 分片推进、按风险分级排序、尽量复用 Biomesafe/unsafe自动修复的 lint 治理方法论以及针对 Typebot 这个多 workspaceapps/*、packages/*monorepo 的具体执行顺序与命令写法。1. 背景Typebot 的 Biome 配置现状Typebot 根目录的 biome.json 开启了对全仓库的 lint 检查linter.enabled truerules.recommended true但为了让代码库保持可构建状态它在五个规则族中显式关闭了以下 8 条规则规则族被关闭的规则计划中的目标performancenoImgElement推动改用next/imagestylenoNonNullAssertion、noParameterAssign消除!断言、禁止重赋参数correctnessuseExhaustiveDependencies、useHookAtTopLevel强化 React hooks 正确性complexitynoForEach用for...of取代forEachsuspiciousnoExplicitAny、useIterableCallbackReturn消除any、统一回调返回值与此同时仓库的格式化与 lint 一体化脚本已经就位见 package.jsonbun format-and-lint→ 等价于biome check .用于 CI 与 pre-commit 检查bun format-and-lint:fix→ 等价于biome check . --write --unsafe用于本地批量自动修复。计划文档的核心目标正是逐步移除上述off并顺带启用一批尚未生效但有价值的规则使biome check .能直接通过。注意biome check .同时覆盖 lint、格式化与 import 整理assist.actions.source.organizeImports已开启因此在启用新规则时--write --unsafe可能同时改动格式与导入顺序属于预期行为。2. 优先级排序标准与快速阅读速记计划文档给出了四条排序标准用于决定先处理哪些规则仓库当前诊断数量nombre de diagnostics actuels数量为 0 的规则可以直接开启Biome 是否提供自动修复safe或unsafesafe修复可靠、可放心批量执行改变应用行为的风险risque de changer le comportement applicatif例如 React hooks 相关的规则可能改变初始化与状态同步时序风险更高diff 的潜在噪音bruit potentiel dans les diffs改动量大、波及文件多的规则会拖慢 review。据此文档定义了一套速记标记便于快速决策0 diag仓库当前无诊断可立即激活safeBiome 自动修复可靠可放心应用unsafe自动修复可行但需要人工复核manual只能人工修正无自动修复。3. 全局规则分级清单3.1 第一批可立即激活0 诊断以下 8 条规则在当前仓库中没有触发任何诊断启用后不会产生任何代码改动属于零成本收益规则用途修复方式suspicious/noMisleadingCharacterClass避免 Unicode 陷阱字符类导致的正则误判safestyle/useSingleVarDeclarator一个声明只声明一个变量unsafea11y/useFocusableInteractive可交互元素必须是可聚焦的manualcorrectness/noUnsafeOptionalChaining禁止在会因undefined而崩溃的上下文使用?.manualstyle/noDescendingSpecificity避免 CSS 选择器按脆弱顺序降序排列manualsuspicious/noAsyncPromiseExecutor禁止new Promise(async ...)反模式manualsuspicious/noThenProperty避免对象含误导性的then属性干扰 Promise 检测manualsuspicious/noUnknownAtRules禁止未知 CSSrulesmanual3.2 第二批safe自动修复的快速胜利以下规则均有诊断但 Biome 提供safe级别的自动修复改动可靠规则诊断数用途style/useExponentiationOperator1将Math.pow替换为**style/useShorthandFunctionType1使用简写函数类型如() voidcorrectness/noSwitchDeclarations3强制switch分支中的let/const使用花括号包裹complexity/noBannedTypes11避免误导性的 TS 类型String、Function、{}style/noUselessElse20删除return/throw之后的无用elsestyle/noUnusedTemplateLiteral70避免无插值的多余反引号style/useSelfClosingElements97无子元素的 JSX 组件使用Foo /而非Foo/Foo3.3 第三批unsafe自动修复但较机械unsafe修复通常可信但仍需人工过一遍 diff规则诊断数用途suspicious/useIsArray1用Array.isArray()取代instanceof Arraysuspicious/noConfusingVoidType2避免在非返回类型/非泛型位置使用voidcomplexity/noUselessTernary7简化无意义的三元表达式complexity/useOptionalChain13将链替换为?.complexity/useLiteralKeys14键为静态字符串时优先obj.foo而非obj[foo]suspicious/noGlobalIsNan16用Number.isNaN取代全局isNaNstyle/useNodejsImportProtocol39Node 内置模块导入强制加node:前缀style/useTemplate57用模板字符串取代字符串拼接3.4 第四批量少但需手工规则诊断数用途correctness/useJsxKeyInIterable1遍历渲染的 JSX 必须提供keysuspicious/noExportsInTest1测试文件中不要exportsuspicious/noDocumentCookie2避免document.cookie ...XSS 面correctness/noEmptyPattern3禁止空解构模式correctness/useHookAtTopLevel3React hooks 只能在顶层调用style/noParameterAssign8禁止对函数参数重新赋值suspicious/useIterableCallbackReturn19map/filter等回调必须有一致的返回值3.5 第五批中等成本 / 潜在噪音规则诊断数用途a11y/noStaticElementInteractions32可点击的div/span必须带 role 并支持键盘操作correctness/useUniqueElementIds33避免可复用组件中出现会重复的静态id...performance/noImgElement50推动用next/image取代imgcomplexity/noForEach84用for...of取代forEach3.6 第六批大工程留到最后规则诊断数修复方式用途correctness/useExhaustiveDependencies63unsafe校验 React hooks 的依赖数组style/noNonNullAssertion76unsafe禁止 TypeScript 非空断言!suspicious/noExplicitAny170manual禁止显式any与 biome.json 对照可以发现noExplicitAny170 个诊断、noNonNullAssertion76 个诊断、useExhaustiveDependencies63 个诊断、useHookAtTopLevel、noForEach84 个诊断、useIterableCallbackReturn、noParameterAssign、noImgElement正是当前被显式off的规则属于迁移的主战场。4. 分阶段 PR 迁移计划PR 1先拿下零诊断与小改动一次性启用全部0 diag规则加上少量低风险小改动suspicious/noMisleadingCharacterClassstyle/useSingleVarDeclaratora11y/useFocusableInteractivecorrectness/noUnsafeOptionalChainingstyle/noDescendingSpecificitysuspicious/noAsyncPromiseExecutorsuspicious/noThenPropertysuspicious/noUnknownAtRulesstyle/useExponentiationOperatorstyle/useShorthandFunctionTypesuspicious/useIsArraycorrectness/noSwitchDeclarationscorrectness/noEmptyPatterncorrectness/useJsxKeyInIterablesuspicious/noExportsInTestsuspicious/noConfusingVoidType理由改动噪音极小、风险低是很好的首战告捷。PR 2机械式自动修复style/noUselessElsestyle/noUnusedTemplateLiteralstyle/useSelfClosingElementsstyle/useTemplatestyle/useNodejsImportProtocolcomplexity/noUselessTernarycomplexity/useOptionalChaincomplexity/useLiteralKeyscomplexity/noBannedTypessuspicious/noGlobalIsNan理由diff 规模更大但基本可自动完成仍然可控。推荐用小批量命令执行例如按规则逐个运行bunx biome lint . --write --unsafe --onlystyle/useTemplate bunx biome lint . --write --unsafe --onlystyle/useSelfClosingElements每次只处理一条规则便于逐条 review也符合 package.json 中biome check . --write --unsafe的既有修复管线。PR 3A浏览器 Cookie 与唯一 ID先处理边界最清晰的两个问题suspicious/noDocumentCookiecorrectness/useUniqueElementIds目标 workspaceapps/landing-pageapps/builder理由爆炸半径小仓库内已有现成的修正模式非常适合作为小 PR 快速收尾。PR 3B交互语义与可访问性a11y/noStaticElementInteractions目标 workspaceapps/builderapps/landing-pagepackages/embeds/js理由这类问题通常需要真正决定 markup 或组件组合方式尤其存在嵌套按钮时需要 review 投入精力审视 HTML 语义与无障碍实现。PR 3C循环 / 回调 / 参数赋值清理将偏机械、与 React 耦合度低的 refactor 集中处理complexity/noForEachsuspicious/useIterableCallbackReturnstyle/noParameterAssign目标 workspacepackages/*apps/builder下的 helpers/actions理由隔离后 diff 可读性强、产品风险低适合在支撑性代码上获得较高产出比。PR 3D类型收紧style/noNonNullAssertionsuspicious/noExplicitAny目标 workspace 顺序先packages/*再apps/builder理由共享类型契约上的改动风险更高不应与 UI 或 hooks 改动混在一张 PR 里。PR 3EReact hooks 语义修正correctness/useExhaustiveDependenciescorrectness/useHookAtTopLevel目标 workspaceapps/builder理由这是功能上最敏感的部分——依赖数组的补全或调整可能改变初始化时机、自动保存与状态同步行为必须单独成 PR 并重点 review。5. 建议执行顺序从文档直译整理立即执行 PR 1零诊断 极小改动。执行PR 2用bunx biome lint . --write --unsafe --only...按小批量推进。执行PR 3A快速清掉最局部、模式最清晰的 Cookie 与唯一 ID 问题。单独执行PR 3B让 review 专注于 HTML 语义与可访问性。在确定performance/noImgElement的 workspace 级策略后执行PR 3C。以机械式方式在packages与 helpers 上执行PR 3D。执行PR 3E先从共享packages/*开始再到apps/builder。最后执行收尾 PR文档中的PR 3F对关键的 React 行为做人工验证。6. PR 3 阶段的优先级总结不要在同一个 PR 里混排UI 语义、框架策略next/image、共享类型、React hooks 四类问题要分开从模式清晰、影响局部的改动开始把 React hooks 与noExplicitAny留到最后优先按风险族分批阅读 diff而不是最后做一张巨型 PR。7. 落地实践要点7.1 命令与工作流完整检查bun format-and-lint即 package.json 中的biome check .批量修复bun format-and-lint:fix即biome check . --write --unsafe单规则修复bunx biome lint . --write --unsafe --onlyruleName文档推荐的小批量方式能显著降低 review 噪音。7.2 与仓库结构的对应关系前端应用集中在apps/builder编辑器、apps/landing-page营销站、apps/viewer渲染端嵌入式脚本在packages/embeds/js共享逻辑与类型集中在packages/*如packages/schemas、packages/typebot、packages/forge等。文档中的 PR 3A3E 的 workspace 切分正是基于这一结构先改应用层边界清晰的问题再改共享包的类型契约最后才动 React hooks 这类牵一发动全身的语义规则。7.3 风险提示unsafe修复并非 100% 无副作用style/useTemplate、complexity/useOptionalChain等规则在改写表达式时可能改变求值细节合入前应跑一遍bun format-and-lint并复查关键 diffcorrectness/useExhaustiveDependencies补全依赖可能触发额外的重新渲染或副作用涉及自动保存、初始化逻辑时需人工回归验证suspicious/noExplicitAny170 个诊断与style/noNonNullAssertion76 个诊断是仓库中体量最大的两个类型问题跨packages/*时会影响共享契约务必按依赖方向先包后应用推进。8. 小结这份迁移计划的精髓在于**先易后难、按风险分片、让自动修复承载大部分机械劳动**先用0 diag规则拿到零成本收益再以safe规则快速清场接着用unsafe规则处理中量级机械改动最后集中人力攻克 a11y、类型收紧与 React hooks 三大敏感区。它既是一份可直接照做的 Typebot 仓库 lint 治理清单也是一套可以迁移到任何采用 Biome 的 monorepo 的规则启用方法论。当前仓库的 biome.json 与 package.json 已为这套方案提供了完整的配置与脚本支撑剩余工作就是按 PR 顺序逐条推进。【免费下载链接】typebot.io Typebot is a powerful chatbot builder that you can self-host.项目地址: https://gitcode.com/GitHub_Trending/ty/typebot.io创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表