Configration Files

.editorconfig

root = true

[*]
charset = utf-8
indent_style = space
indent_size = 2
end_of_line = lf
trim_trailing_whitespace = true
insert_final_newline = true

.eslintrc.cjs

module.exports = {
  root: true,
  ignorePatterns: [ ".eslintrc.cjs" ],
  plugins: [ "import" ],
  extends: [ "eslint:recommended", "plugin:vue/vue3-recommended", "@vue/eslint-config-typescript", "plugin:testing-library/vue", "@vue/eslint-config-prettier" ],
  overrides: [
    {
      files: [ "**/__tests__/**/*.[jt]s?(x)", "**/?(*.)+(spec|test).[jt]s?(x)" ],
      extends: [ "plugin:testing-library/vue" ]
    }
  ],
  parser: "vue-eslint-parser",
  parserOptions: {
    parser: "@typescript-eslint/parser",
    ecmaVersion: "latest",
    sourceType: "module",
    project: [ "./tsconfig.app.json", "./tsconfig.config.json" ],
    extraFileExtensions: [ ".vue" ]
  },
  rules: {
    "no-unused-expressions": "error",
    "object-curly-spacing": [ "error", "always" ],
    "array-bracket-spacing": [ "error", "never" ],
    "arrow-spacing": [ "error", { before: true, after: true } ],
    "comma-spacing": [ "error", { before: false, after: true } ],
    "block-spacing": [ "error", "always" ],
    "keyword-spacing": [ "error", { before: true } ],
    "multiline-ternary": [ "error", "never" ],
    "arrow-body-style": [ "error", "as-needed" ],
    "prefer-arrow-callback": [ "error", { allowNamedFunctions: false } ],
    "func-style": [ "error", "declaration", { allowArrowFunctions: false } ],
    "no-var": "error",
    "no-console": "error",
    "no-new-object": "error",
    camelcase: "error",
    "no-duplicate-imports": "error",
    "array-callback-return": "error",
    "block-scoped-var": "error",
    "dot-notation": "error",
    "no-alert": "error",
    "no-case-declarations": "error",
    "object-shorthand": "error",
    "quote-props": [ "error", "as-needed" ],
    "prefer-object-spread": "error",
    "no-array-constructor": "error",
    "prefer-template": "error",
    "no-loop-func": "error",
    "prefer-rest-params": "error",
    "default-param-last": "error",
    "no-param-reassign": "error",
    "object-curly-newline": [ "error" ],
    "no-nested-ternary": "error",
    "no-mixed-operators": "error",
    "no-unneeded-ternary": "error",
    "brace-style": "error",
    "no-else-return": "error",
    "newline-per-chained-call": "error",
    "no-multiple-empty-lines": "error",
    "space-in-parens": "error",
    "computed-property-spacing": "error",
    "func-call-spacing": "error",
    "key-spacing": "error",
    semi: "error",
    "id-length": "error",
    "no-await-in-loop": "error",
    "no-constant-binary-expression": "error",
    "no-promise-executor-return": "error",
    "no-self-compare": "error",
    "no-template-curly-in-string": "error",
    "no-unreachable-loop": "error",
    "capitalized-comments": "error",
    "default-case-last": "error",
    "default-case": "error",
    complexity: [ "error", { max: 12 } ],
    "max-nested-callbacks": [ "error", 2 ],
    "no-magic-numbers": "error",
    "no-use-before-define": [
      "error",
      {
        variables: true,
        functions: false,
        classes: false
      }
    ],
    "spaced-comment": [
      "error",
      "always",
      {
        block: {
          balanced: true
        }
      }
    ],
    "no-restricted-syntax": [
      "error",
      {
        selector: "UnaryExpression[operator='delete']",
        message: "Avoid using the `delete` keyword. Use alternative approaches like setting the property to undefined."
      }
    ],
    "import/first": "error",
    "import/no-anonymous-default-export": [ "error" ],
    "import/no-commonjs": "error",
    "import/no-mutable-exports": "error",
    "import/order": [
      "error",
      {
        groups: [ "builtin", "external", "internal", [ "parent", "sibling" ], "index", "object", "type" ],
        "newlines-between": "always"
      }
    ],
    "@typescript-eslint/no-unused-vars": [
      "error",
      {
        argsIgnorePattern: "^_",
        destructuredArrayIgnorePattern: "^_",
        ignoreRestSiblings: true
      }
    ],
    "@typescript-eslint/no-explicit-any": "error",
    "@typescript-eslint/naming-convention": [
      "error",
      {
        selector: "default",
        format: [ "camelCase" ]
      },
      {
        selector: "variable",
        format: [ "camelCase" ]
      },
      {
        selector: "import",
        format: null
      },
      {
        selector: "class",
        format: null
      },
      {
        selector: "enum",
        format: [ "PascalCase" ],
        custom: {
          regex: "^[A-Z][a-zA-Z0-9]*$",
          match: true
        }
      },
      {
        selector: "enumMember",
        format: [ "PascalCase" ]
      },
      {
        selector: "property",
        format: [ "camelCase" ]
      },
      {
        selector: "interface",
        format: [ "PascalCase" ]
      },
      {
        selector: "typeAlias",
        format: [ "PascalCase" ]
      }
    ],
    "@typescript-eslint/no-misused-promises": "error",
    "vue/multi-word-component-names": "off",
    "vue/component-name-in-template-casing": [ "error", "PascalCase" ],
    "vue/component-options-name-casing": [ "error", "PascalCase" ],
    "vue/component-definition-name-casing": [ "error", "PascalCase" ],
    "vue/v-on-event-hyphenation": [ "error", "never", { autofix: true } ],
    "vue/attribute-hyphenation": [ "error", "never" ],
    "vue/valid-template-root": "error",
    "vue/html-end-tags": "error",
    "vue/html-quotes": [ "error", "double", { avoidEscape: false } ],
    "vue/mustache-interpolation-spacing": [ "error", "always" ],
    "vue/no-spaces-around-equal-signs-in-attribute": [ "error" ],
    "vue/no-template-shadow": "error",
    "vue/one-component-per-file": "error",
    "vue/prop-name-casing": [ "error", "camelCase" ],
    "vue/require-explicit-emits": "error",
    "vue/require-prop-types": "error",
    "vue/v-bind-style": [ "error", "shorthand" ],
    "vue/v-on-style": [ "error", "shorthand" ],
    "vue/this-in-template": "error",
    "vue/component-api-style": [ "error", [ "script-setup" ] ],
    "vue/custom-event-name-casing": [ "error", "camelCase" ],
    "vue/define-emits-declaration": [ "error", "type-based" ],
    "vue/define-props-declaration": [ "error", "type-based" ],
    "vue/html-button-has-type": [ "error" ],
    "vue/html-comment-content-spacing": [ "error", "always" ],
    "vue/html-comment-indent": [ "error", 2 ],
    "vue/next-tick-style": [ "error", "promise" ],
    "vue/no-empty-component-block": "error",
    "vue/no-multiple-objects-in-class": "error",
    "vue/no-required-prop-with-default": "error",
    "vue/no-undef-properties": "error",
    "vue/no-unsupported-features": "error",
    "vue/no-unused-refs": "error",
    "vue/no-useless-mustaches": "error",
    "vue/no-useless-v-bind": "error",
    "vue/no-v-text": "error",
    "vue/padding-line-between-blocks": "error",
    "vue/padding-line-between-tags": [ "error", [ { blankLine: "always", prev: "*", next: "*" } ] ],
    "vue/prefer-separate-static-class": "error",
    "vue/v-for-delimiter-style": [ "error", "in" ],
    "vue/no-unused-emit-declarations": "error",
    "vue/require-explicit-slots": "error",
    "vue/require-typed-ref": "error",
    "vue/v-if-else-key": "error",
    "vue/no-reserved-component-names": [
      "error",
      {
        disallowVueBuiltInComponents: true,
        disallowVue3BuiltInComponents: true
      }
    ],
    "vue/first-attribute-linebreak": [
      "error",
      {
        singleline: "ignore",
        multiline: "below"
      }
    ],
    "vue/html-closing-bracket-newline": [
      "error",
      {
        singleline: "never",
        multiline: "never"
      }
    ],
    "vue/html-closing-bracket-spacing": [
      "error",
      {
        startTag: "never",
        endTag: "never",
        selfClosingTag: "always"
      }
    ],
    "vue/html-indent": [
      "error",
      2,
      {
        attribute: 1,
        baseIndent: 1,
        closeBracket: 0,
        alignAttributesVertically: true,
        ignores: []
      }
    ],
    "vue/html-self-closing": [
      "error",
      {
        html: {
          void: "always",
          normal: "never",
          component: "always"
        },
        svg: "always",
        math: "always"
      }
    ],
    "vue/max-attributes-per-line": [
      "error",
      {
        singleline: {
          max: 1
        },
        multiline: {
          max: 1
        }
      }
    ],
    "vue/no-multi-spaces": [
      "error",
      {
        ignoreProperties: false
      }
    ],
    "vue/v-slot-style": [
      "error",
      {
        atComponent: "shorthand",
        default: "shorthand",
        named: "shorthand"
      }
    ],
    "vue/attributes-order": [
      "error",
      {
        order: [
          "DEFINITION",
          "LIST_RENDERING",
          "CONDITIONALS",
          "RENDER_MODIFIERS",
          "GLOBAL",
          [ "UNIQUE", "SLOT" ],
          "TWO_WAY_BINDING",
          "OTHER_DIRECTIVES",
          "OTHER_ATTR",
          "EVENTS",
          "CONTENT"
        ],
        alphabetical: false
      }
    ],
    "vue/no-lone-template": [
      "error",
      {
        ignoreAccessible: false
      }
    ],
    "vue/order-in-components": [
      "error",
      {
        order: [
          "el",
          "name",
          "key",
          "parent",
          "functional",
          [ "delimiters", "comments" ],
          [ "components", "directives", "filters" ],
          "extends",
          "mixins",
          [ "provide", "inject" ],
          "ROUTER_GUARDS",
          "layout",
          "middleware",
          "validate",
          "scrollToTop",
          "transition",
          "loading",
          "inheritAttrs",
          "model",
          [ "props", "propsData" ],
          "emits",
          "setup",
          "asyncData",
          "data",
          "fetch",
          "head",
          "computed",
          "watch",
          "watchQuery",
          "LIFECYCLE_HOOKS",
          "methods",
          [ "template", "render" ],
          "renderError"
        ]
      }
    ],
    "vue/block-lang": [
      "error",
      {
        script: {
          lang: "ts"
        }
      }
    ],
    "vue/define-macros-order": [
      "error",
      {
        order: [ "defineProps", "defineEmits" ]
      }
    ],
    "vue/block-order": [
      "error",
      {
        order: [ "script", "template", "style" ]
      }
    ],
    "vue/html-comment-content-newline": [
      "error",
      {
        singleline: "never",
        multiline: "always"
      }
    ],
    "vue/match-component-file-name": [
      "error",
      {
        extensions: [ "vue" ]
      }
    ],
    "vue/new-line-between-multi-line-property": [
      "error",
      {
        minLineOfMultilineProperty: 2
      }
    ],
    "vue/no-static-inline-styles": [
      "error",
      {
        allowBinding: false
      }
    ],
    "vue/no-template-target-blank": [
      "error",
      {
        allowReferrer: false
      }
    ],
    "vue/max-lines-per-block": [
      "error",
      {
        script: 300,
        template: 200,
        style: 200
      }
    ],
    "vue/max-props": [
      "error",
      {
        maxProps: 6
      }
    ]
  }
};

.prettierrc.json

{
  "printWidth": 160,
  "bracketSameLine": true,
  "singleQuote": false,
  "semi": true,
  "arrowParens": "always",
  "trailingComma": "none",
  "singleAttributePerLine": true
}