vue/html-self-closing

安装依赖

pnpm i eslint-plugin-vue --save-dev
pnpm install eslint-plugin-react --save-dev

 eslint

module.exports = {
  root: true,
  env: {
    node: true,
  },
  extends: [
    "plugin:vue/essential",
    "plugin:vue/recommended",
    "eslint:recommended",
    "@vue/prettier",
  ],
  parserOptions: {
    parser: "@babel/eslint-parser",
  },
  rules: {
    "vue/html-self-closing": [
      "error",
      {
        html: {
          void: "any",
          normal: "always",
          component: "always",
        },
        svg: "always",
        math: "always",
      },
    ],
    "react/self-closing-comp": [
      "error",
      {
        // 使用这个规则来处理 JSX 自闭合
        component: true,
        html: true,
      },
    ],
    "vue/component-name-in-template-casing": [
      "error",
      "kebab-case",
      {
        registeredComponentsOnly: false,
        ignores: ["currentPage", "pageSize"],
      },
    ],
    // "vue/name-property-casing": ["error", "kebab-case"],
    "vue/order-in-components": [
      "error",
      {
        order: [
          "name",
          "components",
          "props",
          "data",
          "computed",
          "watch",
          "methods",
          "beforeCreate",
          "created",
          "beforeMount",
          "mounted",
          "beforeUpdate",
          "updated",
          "beforeDestroy",
          "destroyed",
          "activated",
          "deactivated",
          "errorCaptured",
          "filters",
          "directives",
          "provide",
          "inject",
        ],
      },
    ],
    "vue/attributes-order": [
      "error",
      {
        order: [
          // ["id"],
          // ["class"],
          // "name",
          // "data-*",
          // "src",
          // "href",
          // "alt",
          // "title",
          // "style",
          // "v-*",
          // "on*",
          // "bind*",
          // "directives*",
          // "slot",
          // "key"
        ],
      },
    ],
    "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
    "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
    "no-unused-vars": "off",
    eqeqeq: "error",
    "prettier/prettier": [
      "error",
      {
        semi: false,
        singleQuote: true,
        printWidth: 80,
        endOfLine: "auto",
        trailingComma: "none",
        proseWrap: "never",
        arrowParens: "avoid",
      },
    ],
    "vue/no-unused-components": 0,
  },
  globals: {
    T: true,
  },
  overrides: [
    {
      files: [
        "**/__tests__/*.{j,t}s?(x)",
        "**/tests/unit/**/*.spec.{j,t}s?(x)",
      ],
      env: {
        mocha: true,
      },
    },
  ],
  plugins: [
    "react", // 添加这一行
  ],
};