@persagy2/eslint-plugin/src/config/basic.ts

一个适用于 vue3.x、typescript 项目的通用eslint预设插件

/** eslint-disable max-len */

import { Linter } from 'eslint'

import { createConfig } from '../utils/create-config'

/**
 * 基础策略
 *
 * @包含
 * 1. 强制性语义语法校验
 * 2. 安全相关
 */
export const basic: Linter.Config = createConfig()
    //
    .extends('plugin:@persagy2/parser')
    .level('error')

    /* 安全 */
    .rule('no-eval') // 禁止使用 eval('') 动态执行
    .rule('@typescript-eslint/no-implied-eval') // 禁止使用隐式的 eval 语句, bad: setTimeout('', 0)

    /* 语义、语法校验 */

    /* 必须使用有效的语句, 禁止出现无效的属性 */
    .rule('no-undef') // 禁止使用未声明的变量
    .rule('no-loss-of-precision') // 禁止使用失去精度的文字数字
    .rule('no-delete-var') // 禁止使用 delete 删除对象本身

    // 正则相关
    .rule('no-invalid-regexp') // 正则: 禁止使用无效的正则表达式
    .rule('no-useless-backreference') // 正则: 禁止出现无效的反向引用

    // class 类声明
    .rule('no-invalid-this') // 禁止使用无效的 this
    .rule('no-constructor-return') // 禁止在构造函数中使用 return

    // 特定语法
    .rule('constructor-super') // 检查类构造函数的 super() 方法使用是否正确
    .rule('getter-return') // getter 语句必须包含 return
    .rule('no-setter-return') // setter 语句不能存在return
    .rule('no-this-before-super') // 在调用构造函数之前禁止this/super()
    .rule('unicorn/no-invalid-remove-event-listener') // 检查 .removeEventListener() 语句的使用是否正确

    /* 语法限制 */
    /** 受限语句, 变量 */
    .rule('no-irregular-whitespace') // 禁止出现不规则的空格 (如: mac 上 alt + space输入的特殊空格)
    .rule('no-shadow-restricted-names') // 禁止使用受限的对象作为变量命名, bad: NaN, Infinity, undefined

    /** 特定语法 */
    .rule('use-isnan') // 禁止使用 === NaN, 要求使用 isNaN()
    .rule('valid-typeof') // 强制 typeof 与有效的字符串对比
    .rule('no-unsafe-finally') // 禁止在finally块中使用控制流语句 (如: return)
    .rule('no-unsafe-negation') // 禁止对关系运算符的左操作数求反, re: `if (!f instanceof Array)` -> `if (!(f instanceof Array))`
    .rule('no-useless-escape') // 禁止不必要的转义字符. re: 参考官网

    /** 正则相关 */
    .rule('no-control-regex') // 正则: 禁止出现控制字符
    .rule('no-empty-character-class') // 正则: 禁止在正则表达式中使用空字符类 (注: 禁用 /[]/)

    /* 禁止重复声明(覆盖)已声明的变量 */
    .rule('no-redeclare') // 禁止重新的 变量声明
    .rule('no-dupe-args') // 禁止重复的 参数定义
    .rule('no-dupe-class-members') // 禁止重复的 类成员变量 (方法)
    .rule('no-dupe-keys') // 禁止重复的 key (对象中重复属性)
    .rule('no-class-assign') // 禁止重复的 类定义
    .rule('no-const-assign') // 禁止重复的 const 定义
    .rule('no-func-assign') // 禁止重复的 function 定义
    .rule('no-import-assign') // 禁止覆盖已定义的 import 属性

    /** language: ts */
    /* 必须使用有效的语句, 禁止出现无效的属性 */
    .rule('@typescript-eslint/ban-ts-comment') // 禁止 ts 指令注释后, 跟随注释内容
    .rule('@typescript-eslint/adjacent-overload-signatures') // 要求成员重载是连续的
    .rule('@typescript-eslint/no-loss-of-precision') // 禁止失去精度的文字数字
    .rule('@typescript-eslint/no-invalid-this') // 禁止使用无效的 this
    .rule('@typescript-eslint/no-non-null-assertion') // 使用可能为空的属性后, 禁止使用后缀运算符的非空断言

    /* 禁止覆盖(重复声明) 已声明的变量, 或覆盖系统关键字 */
    .rule('@typescript-eslint/no-redeclare') // 禁止重新声明变量
    .rule('@typescript-eslint/no-dupe-class-members') // 禁止重新声明类成员变量

    /** language: vue */

    /** 注: 由于 v2.7.* 的关系, 部分 composition api 与 vue2.x是兼容的, 所以针对通用的规则, 这里不做区分 */
    /* 基础指令 */
    .rule('vue/comment-directive') // 支持评论指令<template>
    .rule('vue/jsx-uses-vars') // 防止 JSX 中使用的变量被标记为未使用

    /* 必须使用有效的语句, 禁止出现无效的属性 */
    // 基础语义
    .rule('vue/valid-attribute-name')
    .rule('vue/valid-define-emits')
    .rule('vue/valid-define-props')
    .rule('vue/valid-next-tick')
    .rule('vue/valid-template-root')
    .rule('vue/valid-v-bind')
    .rule('vue/valid-v-cloak')
    .rule('vue/valid-v-else-if')
    .rule('vue/valid-v-else')
    .rule('vue/valid-v-for')
    .rule('vue/valid-v-html')
    .rule('vue/valid-v-if')
    .rule('vue/valid-v-model')
    .rule('vue/valid-v-on')
    .rule('vue/valid-v-once')
    .rule('vue/valid-v-pre')
    .rule('vue/valid-v-show')
    .rule('vue/valid-v-slot')
    .rule('vue/valid-v-text')
    .rule('vue/valid-v-is')
    .rule('vue/valid-v-memo')

    // template 特性
    .rule('vue/no-parsing-error') // 禁止出现模板解析错误
    .rule('vue/no-template-key') // 禁止在 template 标签上出现 key 属性, vue3.x 的 v-for 除外

    // composition api 特性
    .rule('vue/no-export-in-script-setup') // 禁止在单文件组件(script setup)中, 使用 export 导出
    .rule('vue/no-setup-props-destructure') // 禁止在不合适的地方结构 prop, 因为会使其失去响应式特性 注: vue composition api 语法

    // vue3.x 特性
    .rule('vue/no-expose-after-await') // 受限代码: 禁止在异步事件(await 后), 注册声明 expose
    .rule('vue/no-lifecycle-after-await') // 受限代码: 禁止在异步事件(await 后), 注册生命周期钩子 (如: onMounted)
    .rule('vue/no-watch-after-await') // 受限代码: 禁止在异步事件(await 后), 注册 watch 监听

    /* 禁止覆盖(重复声明) 已声明的变量, 或覆盖系统关键字 */
    .rule('vue/no-reserved-component-names') // 禁止组件名称定义(使用)为 html标签名 或 保留字
    .rule('vue/no-reserved-keys') // 禁止覆盖 vue 保留的关键字
    .rule('vue/no-dupe-keys') // 禁止重复的 key (对象中重复属性)
    .rule('vue/no-mutating-props') // 禁止修改 props 中定义的属性值 (会抛出 vue warn)
    .rule('vue/no-reserved-props') // 禁止 props 中声明的变量使用 vue 保留的关键字
    .rule('vue/no-async-in-computed-properties') // 禁止计算属性中的异步操作
    .rule('vue/no-computed-properties-in-data') // 禁止在 data 定义中访问 计算属性(completed)

    .config()