使用rome.tools改进前端项目的质量

Rome是JavaScript，TypeScript，JSON，HTML，Markdown和CSS的格式化程序，linter，bundler等。

Rome旨在取代Babel，ESLint，webpack，Prettier，Jest等。

Rome统一了以前是独立工具的功能。基于共享基础构建使我们能够为处理代码、显示错误、并行化工作、缓存和配置提供有凝聚力的体验。

Rome有很强的惯例，旨在拥有最小的配置。阅读更多关于我们的项目理念。

Rome是用鲁斯特写的。

Rome拥有一流的IDE支持，具有复杂的解析器，可以完全保真地表示源文本 和一流的错误恢复。

Rome是麻省理工学院根据贡献者盟约行为准则获得许可和主持的。

Rome目前有68条推荐配置，全部规则有133条。在使用初期可以使用推荐配置，避免过多的警告造成无从下手改进。随着推荐规则跑得很顺的情况下，可以尝试更多的规则组合来改进代码规范和发现潜在缺陷。

使用gui配置工具

使用gui配置工具，可以让配置rome规则更简单。

在凌鲨(linksaas)的微应用里面可以找到rome配置工具，快速对rome进行配置。

凌鲨(linksaas)是以开源方式运作的，您可以从linksaas · 极狐GitLab 访问源代码。也可以从 凌鲨 软件研发团队信息枢纽 下载预编译的版本。

附录

检查规则

• noAccessKey 强制在任何HTML元素上都不使用accessKey属性。
• noAutofocus 避免使用autoFocus属性
• noBlankTarget 不允许不带rel=“noreferrer”的target=“_blank”属性
• noDistractingElements 强制不使用分散注意力的元素。
• noHeaderScope 请检查scope属性是否仅用于th元素。
• noPositiveTabindex 禁止在tabIndex属性上使用正整数
• useAltText 图像或区域的替代文本有助于依靠屏幕读者来理解图像的目的和上下文。
• useAnchorContent 强制锚元素具有内容，并且屏幕阅读器可以访问该内容。
• useButtonType 强制元素按钮使用属性类型
• useHtmlLang 强制该html元素具有lang属性。这允许用户选择默认语言之外的其他语言。
• useKeyWithClickEvents 强制将onClick鼠标事件与onKeyUp、onKeyDown或onKeyPress键盘事件一起使用。
• useKeyWithMouseEvents 强制只使用键盘的用户在onMouseOver/onMouseOut的同时使用onFocus/onBlur。重要的是要考虑到不能使用鼠标、使用辅助技术或读屏器的身体残疾用户。
• useValidAnchor 强制所有锚点都是有效的，并且它们是可导航的元素。
• noExtraBooleanCast 不允许不必要的布尔型强制转换
• noMultipleSpacesInRegularExpressionLiterals 不允许在正则表达式文字中不清楚地使用多个空格字符
• noUselessFragments 不允许不必要的碎片
• useFlatMap 当map().flat()一起使用时，促进.flatMap()的使用。
• useOptionalChain 强制使用简洁的可选链，而不是链接的逻辑表达式。
• useSimplifiedLogicExpression 放弃逻辑表达式中的冗余项。
• noChildrenProp 防止把children当作属性使用。
• noConstAssign 防止重新分配常量变量。
• noConstructorReturn 不允许从构造函数返回值。
• noEmptyPattern 不允许空的销毁模式。
• noNewSymbol 不允许使用Symbol对象的新运算符
• noPrecisionLoss 不允许丢失精度的文字数字
• noRenderReturnValue 防止使用React.render的返回值。
• noSetterReturn 不允许从setter返回值
• noStringCaseMismatch 不允许将修改字符串大小写的表达式与不兼容的值进行比较。
• noUndeclaredVariables 防止使用文档中未声明的变量
• noUnnecessaryContinue 避免使用不必要的continue
• noUnreachable 禁止无法访问的代码
• noUnsafeFinally 不允许在finally块中使用控制流语句。
• noUnusedVariables 不允许使用未使用的变量。
• noVoidElementsWithChildren 此规则防止void元素（又名自闭元素）生成子元素。
• noVoidTypeReturn 不允许从返回类型为“void”的函数返回值
• useValidForDirection 强制执行“for”循环更新子句，使计数器向正确方向移动。
• noDelete 不允许使用delete运算符。
• noDangerouslySetInnerHtml 防止使用JSX中危险的属性
• noDangerouslySetInnerHtmlWithChildren 当DOM元素或组件同时使用children和dangerouslySetInnerHTML道具时报告。
• noArguments 不允许使用arguments
• noImplicitBoolean 不允许在JSX布尔属性上使用隐式真值
• noNegationElse 如果if语句有else子句，则不允许在if语句的条件下使用否定
• noNonNullAssertion 不允许使用!后缀运算符
• noShoutyConstants 不允许使用其值为其名称的大写版本的常量。
• noUnusedTemplateLiteral 如果不需要插值和特殊字符处理，则不允许使用模板文字
• noVar 不允许使用var
• useBlockStatements 需要以下大括号约定。当一个块只包含一条语句时，JavaScript允许省略大括号。然而，许多人认为，最好不要在块周围省略大括号，即使它们是可选的，因为这会导致错误并降低代码的清晰度。
• useConst 对于在声明后从未重新分配的变量，需要使用const声明。
• useDefaultParameterLast 强制将默认函数参数和可选参数设置为最后一个。
• useEnumInitializers 要求显式初始化每个枚举成员值。
• useExponentiationOperator 不允许使用Math.pow而使用**运算符。
• useFragmentSyntax 此规则强制使用<>…而不是…。
• useNumericLiterals 不允许parseInt()和Number.parseInt()使用二进制、八进制和十六进制文字
• useSelfClosingElements 防止没有子级的组件使用额外的结束标记
• useShorthandArrayType 在表达数组类型时，此规则提倡使用T[]简写，而不是array
• useSingleCaseStatement 强制switch子句只有一条语句，并发出一个快速修复程序，将语句包装在一个块中。
• useSingleVarDeclarator 不允许在同一变量语句中使用多个变量声明
• useTemplate 比起字符串串联，模板文本更受欢迎。
• useWhile 当不需要初始值设定项和更新表达式时，强制使用while循环而不是for循环
• noArrayIndexKey 禁止在键中使用数组索引。
• noAsyncPromiseExecutor 不允许使用异步函数作为Promise执行器。
• noCatchAssign 不允许在catch子句中重新分配异常。
• noCommentText 阻止注释作为文本节点插入
• noCompareNegZero 不允许与-0进行比较
• noConstEnum 不允许在TypeScript中使用const enum
• noDebugger 不允许使用debugger
• noDoubleEquals 需要使用===和!==
• noDuplicateObjectKeys 防止对象文字具有多个相同名称的属性声明。如果多次定义具有相同名称的对象属性（将getter和setter组合在一起时除外），则只有最后一个定义将其放入对象中，而忽略以前的定义，这很可能是一个错误。
• noDuplicateParameters 不允许重复的函数参数名称
• noEmptyInterface 不允许声明空接口。
• noExplicitAny 不允许any类型的使用。
• noExtraNonNullAssertion 防止在TypeScript文件中错误使用非null断言运算符!。
• noFunctionAssign 不允许重新分配函数声明。
• noImportAssign 不允许分配给导入的绑定
• noLabelVar 不允许与变量共享名称的标签
• noRedundantUseStrict 防止有多余的“use strict”。
• noShadowRestrictedNames 禁止标识符隐藏受限制的名称。
• noSparseArray 不允许稀疏数组
• noUnsafeNegation 不允许使用不安全的否定。
• useDefaultSwitchClauseLast 强制switch语句中的默认子句为最后一个
• useValidTypeof 此规则验证$expr一元表达式类型的结果是否与有效值进行比较，这些值可以是包含有效类型名的字符串文字，也可以是其他类型的表达式
• noAriaUnsupportedElements 强制不支持ARIA角色、状态和属性的元素不具有这些属性。
• noAssignInExpressions 不允许在表达式中进行赋值。
• noBannedTypes 不允许使用某些类型。
• noClassAssign 不允许重新分配类成员
• noCommaOperator 不允许使用逗号运算符。
• noConfusingArrow 不允许箭头函数与比较混淆。
• noConfusingLabels 不允许使用非循环的带标签语句。
• noConsoleLog 不允许使用console.log
• noDuplicateCase 不允许重复的case。如果switch语句在case子句中有重复的测试表达式，那么很可能是程序员复制了case子句，但忘记了更改测试表达式。
• noDuplicateClassMembers 不允许重复的类成员。
• noDuplicateJsxProps 防止多次指定JSX属性。
• noExtraLabels 不允许使用不必要的标签。
• noExtraSemicolons 键入错误和对需要分号的地方的误解可能会导致不必要的分号。虽然从技术上讲这不是一个错误，但在读取代码时，额外的分号可能会造成混乱。
• noForEach 推荐使用for...of,而不是Array.forEach。
• noGlobalObjectCalls 不允许将全局对象属性作为函数调用
• noInferrableTypes 不允许对使用文字表达式初始化的变量、参数和类属性使用类型注释
• noInnerDeclarations 不允许在嵌套块中使用函数和var声明。
• noInvalidConstructorSuper 防止在类内部错误地使用super()。它还检查扩展其他构造函数的类中是否缺少调用super()。
• noNamespace 禁止使用TypeScript的namespace。
• noNoninteractiveElementToInteractiveRole 强制不将交互式ARIA角色分配给非交互式HTML元素。
• noNoninteractiveTabindex 强制不将tabIndex分配给非交互式HTML元素。
• noParameterAssign 不允许重新分配函数参数。
• noParameterProperties 不允许在类构造函数中使用参数属性。
• noPrototypeBuiltins 不允许直接使用Object.prototype内置函数。
• noRedeclare 不允许在同一范围内重新声明变量、函数、类和类型。
• noRedundantAlt 强制img alt属性不包含单词“image”、“picture”或“photo”。
• noRedundantRoles 强制显式角色属性与元素上的隐式/默认角色属性不同。
• noRestrictedGlobals 此规则允许您指定不希望在应用程序中使用的全局变量名。
• noSelfAssign 不允许双方完全相同的分配。
• noSelfCompare 不允许在双方完全相同的情况下进行比较。
• noSvgWithoutTitle 强制使用svg元素的title元素。
• noSwitchDeclarations 不允许在switch子句中使用词法声明。
• noUnreachableSuper 如果类具有超类，则确保在访问类构造函数之前，在类构造函数中的每个代码路径上只调用一次super()构造函数
• noUnsafeOptionalChaining 不允许使用未定义值的上下文中使用可选链接。
• noUnusedLabels 不允许使用未使用的标签
• noUselessCatch 不允许使用不必要的catch子句。
• noUselessRename 不允许将导入、导出和已销毁的赋值重命名为相同的名称。
• noUselessSwitchCase 不允许在switch语句中使用无用的case。
• noWith 不允许使用非严格上下文中的语句。
• useAriaPropTypes 强制ARIA状态和属性值有效。
• useAriaPropsForRole 强制具有ARIA角色的元素必须具有该角色所需的所有ARIA属性。
• useCamelCase 强制执行驼峰命名约定。
• useExhaustiveDependencies 强制正确指定所有依赖项。
• useHookAtTopLevel 强制所有React钩子都是从顶级组件函数调用的。
• useIframeTitle 强制使用元素iframe的属性title
• useIsNan 检查NaN时需要调用isNaN()。
• useLiteralKeys 强制使用对属性的文字访问而不是计算属性访问。
• useMediaCaption 强制音频和视频元素必须有一个字幕音轨。
• useNamespaceKeyword 需要使用namespace关键字而不是module关键字来声明TypeScript命名空间。
• useValidAriaProps 确保ARIA属性ARIA-*都有效。
• useValidLang 确保传递给lang属性的属性是正确的ISO语言和/或国家/地区。
• useYield 要求生成器函数包含yield。