@useinsider/eslint-config 1.0.1-beta.8 → 1.1.2

package/README.md

@@ -1,12 +1,7 @@
-# ESLint Config
-
-Welcome to Insider's shared ESLint configuration! This project offers a set of
-ESLint rules tailored for both EcmaScript/JavaScript and TypeScript. It is
-designed to help you seamlessly integrate Insider's coding style into your
-development workflow.
+# ESLint Configurations
 
 ## Table of Contents
-- [ESLint Config](#eslint-config)
+- [ESLint Configurations](#eslint-configurations)
   - [Table of Contents](#table-of-contents)
   - [Getting Started](#getting-started)
     - [Installation](#installation)
@@ -26,14 +21,14 @@ using the `-D` and `-E` flags in your package manager commands.
 ### Installation
 
 1. **Install as a Development Dependency:**
-   - For npm users:
-     ```bash
-     npm install -D -E @useinsider/eslint-config
-     ```
    - For pnpm users:
      ```bash
      pnpm add -D -E @useinsider/eslint-config
      ```
+   - For npm users:
+     ```bash
+     npm install -D -E @useinsider/eslint-config
+     ```
 2. **Create an ESLint config file:**
    You'll need an ESLint config file in your projects root directory.
 

package/package.json

@@ -1,20 +1,36 @@
 {
     "name": "@useinsider/eslint-config",
+    "version": "1.1.2",
+    "description": "A collection of ESLint configurations provided by @useinsider, offering support for various environments including Vanilla JS, TypeScript, and framework-specific setups such as Vue 3.",
+    "keywords": [
+        "useinsider",
+        "eslint",
+        "eslint-config",
+        "lint",
+        "code style",
+        "vanilla",
+        "typescript",
+        "vue",
+        "vue3",
+        "node"
+    ],
     "author": "Sahin Deniz <sahin.deniz@useinsider.com>",
     "license": "MIT",
-    "version": "1.0.1-beta.8",
     "packageManager": "pnpm@8.11.0",
     "scripts": {
-        "lint": "eslint --ext .js,.cjs ./",
-        "lint:fix": "pnpm lint --fix"
+        "lint": "eslint ./",
+        "lint:ci": "pnpm lint --quiet",
+        "lint:fix": "pnpm lint --fix",
+        "release": "semantic-release -e semantic-release-monorepo"
     },
-    "homepage": "https://github.com/useinsider/eslint-config#readme",
+    "homepage": "https://github.com/useinsider/config/tree/master/packages/eslint-config#readme",
     "repository": {
         "type": "git",
-        "url": "git+https://github.com/useinsider/eslint-config.git"
+        "url": "https://github.com/useinsider/config",
+        "directory": "packages/eslint-config"
     },
     "bugs": {
-        "url": "https://github.com/useinsider/eslint-config/issues"
+        "url": "https://github.com/useinsider/config/issues"
     },
     "exports": {
         ".": "./src/node/index.cjs",
@@ -45,7 +61,9 @@
         "@semantic-release/git": "10.0.1",
         "@types/eslint": "8.44.8",
         "@types/node": "20.10.2",
-        "semantic-release": "22.0.8"
+        "@useinsider/release-config": "workspace:*",
+        "semantic-release": "19.0.5",
+        "semantic-release-monorepo": "7.0.5"
     },
     "optionalDependencies": {
         "@rushstack/eslint-patch": ">=1.6.0",
@@ -57,8 +75,5 @@
         "eslint-plugin-vue": ">=9.19.2",
         "eslint-plugin-vue-scoped-css": ">=2.5.1",
         "vue-eslint-parser": ">=9.3.2"
-    },
-    "publishConfig": {
-        "access": "restricted"
     }
 }

package/src/rules/core.cjs

@@ -13,7 +13,13 @@ module.exports = {
         'guard-for-in': 'error',
         'handle-callback-err': ['error'],
         'import/extensions': ['error', {
+            css: 'always',
             js: 'never',
+            json: 'always',
+            jsx: 'never',
+            sass: 'always',
+            scss: 'always',
+            svg: 'always',
             ts: 'never',
             tsx: 'never',
             vue: 'always',
@@ -62,6 +68,7 @@ module.exports = {
         }],
         'no-invalid-regexp': ['error'],
         'no-iterator': ['error'],
+        'no-mixed-operators': 'off',
         'no-multi-str': ['error'],
         'no-native-reassign': 'error',
         'no-nested-ternary': ['error'],
@@ -120,18 +127,18 @@ module.exports = {
             },
             {
                 blankLine: 'always',
-                prev: ['*'],
                 next: ['multiline-block-like'],
+                prev: ['*'],
             },
             {
                 blankLine: 'always',
-                prev: ['multiline-block-like'],
                 next: ['*'],
+                prev: ['multiline-block-like'],
             },
             {
                 blankLine: 'any',
-                prev: ['case'],
                 next: ['case'],
+                prev: ['case'],
             },
             {
                 blankLine: 'any',
@@ -144,6 +151,7 @@ module.exports = {
         }],
         'prefer-destructuring': ['error'],
         radix: ['error', 'as-needed'],
+        semi: 'off',
         'space-before-function-paren': 'off',
         strict: ['error'],
         'use-isnan': ['error'],

package/src/rules/stylistic.cjs

@@ -24,6 +24,10 @@ module.exports = {
         '@stylistic/implicit-arrow-linebreak': ['error', 'beside'],
         '@stylistic/indent': ['error', 4, {
             SwitchCase: 1,
+            ignoredNodes: [
+                'PropertyDefinition[decorators]',
+                'TSUnionType',
+            ],
         }],
         '@stylistic/key-spacing': ['error'],
         '@stylistic/keyword-spacing': ['error'],
@@ -53,6 +57,7 @@ module.exports = {
         '@stylistic/multiline-ternary': ['error', 'always-multiline'],
         '@stylistic/new-parens': ['error', 'always'],
         '@stylistic/no-extra-parens': ['error', 'all', {
+            allowParensAfterCommentPattern: '@type',
             enforceForArrowConditionals: false,
             nestedBinaryExpressions: false,
             returnAssign: false,

package/src/rules/typescript.cjs

@@ -24,13 +24,7 @@ module.exports = {
         'no-useless-constructor': 'off',
         '@typescript-eslint/no-useless-constructor': 'error',
         '@typescript-eslint/array-type': ['error', { default: 'array', readonly: 'array' }],
-        '@typescript-eslint/indent': ['error', 4, {
-            SwitchCase: 1,
-            ignoredNodes: [
-                'PropertyDefinition[decorators]',
-                'TSUnionType',
-            ],
-        }],
+        '@typescript-eslint/indent': 'off',
         semi: 'off',
         '@typescript-eslint/semi': ['error', 'always'],
         '@typescript-eslint/no-misused-promises': ['error', {
@@ -42,9 +36,5 @@ module.exports = {
         '@typescript-eslint/lines-between-class-members': ['error', 'always', {
             exceptAfterSingleLine: true,
         }],
-
-        // TODO enable after SD-80950
-        '@typescript-eslint/no-empty-function': 'off',
-        '@typescript-eslint/no-explicit-any': 'off',
     },
 };

package/src/rules/vue.cjs

@@ -1,180 +1,166 @@
-/** @type {import("eslint").Linter.RulesRecord} */
-const vueRules = {
-    'vue/array-bracket-newline': ['error'],
-    'vue/array-bracket-spacing': ['error', 'never'],
-    'vue/arrow-spacing': ['error'],
-    'vue/attribute-hyphenation': ['error', 'always'],
-    'vue/attributes-order': ['error', {
-        alphabetical: false,
-        order: [
-            'DEFINITION',
-            'LIST_RENDERING',
-            'CONDITIONALS',
-            'RENDER_MODIFIERS',
-            'GLOBAL',
-            'UNIQUE',
-            'TWO_WAY_BINDING',
-            'OTHER_DIRECTIVES',
-            'OTHER_ATTR',
-            'EVENTS',
-            'CONTENT',
-        ],
-    }],
-    'vue/brace-style': ['error', '1tbs'],
-    'vue/comma-dangle': ['error', {
-        arrays: 'always-multiline',
-        exports: 'always-multiline',
-        functions: 'never',
-        imports: 'always-multiline',
-        objects: 'always-multiline',
-    }],
-    'vue/comma-spacing': ['error'],
-    'vue/comma-style': ['error', 'last'],
-    'vue/component-definition-name-casing': ['error', 'PascalCase'],
-    'vue/component-name-in-template-casing': ['error', 'PascalCase', {
-        registeredComponentsOnly: false,
-        ignores: [
-            'component',
-            'transition',
-        ],
-    }],
-    'vue/component-tags-order': ['error', {
-        order: [
-            'script[setup]',
-            'template',
-            'script:not([setup])',
-            'style',
-        ],
-    }],
-    'vue/dot-location': ['error'],
-    'vue/dot-notation': ['error'],
-    'vue/eqeqeq': ['error'],
-    'vue/func-call-spacing': ['error'],
-    'vue/html-closing-bracket-newline': ['error', {
-        multiline: 'never',
-        singleline: 'never',
-    }],
-    'vue/html-end-tags': ['error'],
-    'vue/html-indent': ['error', 4],
-    'vue/html-quotes': ['error', 'double'],
-    'vue/html-self-closing': ['error'],
-    'vue/html-closing-bracket-spacing': ['error'],
-    'vue/key-spacing': ['error'],
-    'vue/keyword-spacing': ['error'],
-    'vue/max-attributes-per-line': ['error', {
-        multiline: {
-            max: 1,
-        },
-        singleline: 1,
-    }],
-    'vue/max-len': ['error', 120, {
-        ignoreComments: true,
-        ignoreRegExpLiterals: true,
-        ignoreTemplateLiterals: true,
-        ignoreTrailingComments: true,
-        ignoreUrls: true,
-    }],
-    'vue/multi-word-component-names': 'off',
-    'vue/mustache-interpolation-spacing': ['error', 'always'],
-    'vue/no-bare-strings-in-template': ['error'],
-    'vue/no-constant-condition': ['error'],
-    'vue/no-empty-component-block': ['error'],
-    'vue/no-empty-pattern': ['error'],
-    'vue/no-extra-parens': ['error'],
-    'vue/no-irregular-whitespace': ['error'],
-    'vue/no-multi-spaces': ['error'],
-    'vue/no-multiple-objects-in-class': ['error'],
-    'vue/no-potential-component-option-typo': ['error'],
-    'vue/no-reserved-component-names': ['error'],
-    'vue/no-restricted-syntax': ['error'],
-    'vue/no-spaces-around-equal-signs-in-attribute': ['error'],
-    'vue/no-sparse-arrays': ['error'],
-    'vue/no-undef-components': ['error'],
-    'vue/no-unsupported-features': ['error'],
-    'vue/no-unused-properties': ['error'],
-    'vue/no-unused-refs': ['error'],
-    'vue/no-use-computed-property-like-method': ['error'],
-    'vue/no-use-v-if-with-v-for': 'error',
-    'vue/no-useless-concat': ['error'],
-    'vue/no-useless-mustaches': ['error'],
-    'vue/no-useless-v-bind': ['error'],
-    'vue/no-v-text': ['error'],
-    'vue/object-curly-newline': ['error', {
-        consistent: true,
-    }],
-    'vue/object-curly-spacing': ['error', 'always'],
-    'vue/object-property-newline': ['error', {
-        allowAllPropertiesOnSameLine: true,
-    }],
-    'vue/object-shorthand': ['error', 'always'],
-    'vue/order-in-components': ['error', {
-        order: [
-            'el',
-            'name',
-            'parent',
-            'functional',
-            ['delimiters', 'comments'],
-            ['components', 'directives', 'filters'],
-            'extends',
-            'mixins',
-            'inheritAttrs',
-            'model',
-            ['props', 'propsData'],
-            'data',
-            'computed',
-            'watch',
-            'LIFECYCLE_HOOKS',
-            'methods',
-            ['template', 'render'],
-            'renderError',
-        ],
-    }],
-    'vue/padding-line-between-blocks': ['error'],
-    'vue/prefer-separate-static-class': ['error'],
-    'vue/prefer-template': ['error'],
-    'vue/prefer-true-attribute-shorthand': ['error'],
-    'vue/prop-name-casing': ['error', 'camelCase'],
-    'vue/quote-props': ['error', 'as-needed'],
-    'vue/require-default-prop': ['error'],
-    'vue/require-prop-type-constructor': 'error',
-    'vue/require-prop-types': ['error'],
-    'vue/script-indent': ['error', 4, {
-        switchCase: 1,
-    }],
-    'vue/space-in-parens': ['error', 'never'],
-    'vue/space-infix-ops': ['error'],
-    'vue/space-unary-ops': ['error'],
-    'vue/template-curly-spacing': ['error'],
-    'vue/this-in-template': ['error', 'never'],
-    'vue/v-bind-style': ['error', 'shorthand'],
-    'vue/v-on-function-call': 'off',
-    'vue/v-on-style': ['error', 'shorthand'],
-    'vue/v-on-event-hyphenation': 'off',
-    'vue/no-setup-props-destructure': 'off',
-    'vue/block-tag-newline': ['error', {
-        singleline: 'always',
-        multiline: 'always',
-    }],
-    'vue/require-explicit-emits': ['error'],
-    'vue/no-required-prop-with-default': ['error'],
-    'vue/no-ref-object-destructure': ['error'],
-    'vue/no-template-target-blank': ['error'],
-    'vue/define-emits-declaration': ['error', 'type-based'],
-    'vue/define-props-declaration': ['error', 'type-based'],
-};
-
-// Following rules will be refactored within SD-71639
-const vueCSSRules = {
-    'vue-scoped-css/enforce-style-type': 'off',
-    'vue-scoped-css/require-v-deep-argument': 'off',
-    'vue-scoped-css/no-unused-selector': 'off',
-    'vue-scoped-css/no-deprecated-deep-combinator': ['error'],
-};
-
 /** @type {import("eslint").Linter.Config} */
 module.exports = {
     rules: {
-        ...vueRules,
-        ...vueCSSRules,
+        'vue/array-bracket-newline': ['error'],
+        'vue/array-bracket-spacing': ['error', 'never'],
+        'vue/arrow-spacing': ['error'],
+        'vue/attribute-hyphenation': ['error', 'always'],
+        'vue/attributes-order': ['error', {
+            alphabetical: false,
+            order: [
+                'DEFINITION',
+                'LIST_RENDERING',
+                'CONDITIONALS',
+                'RENDER_MODIFIERS',
+                'GLOBAL',
+                'UNIQUE',
+                'TWO_WAY_BINDING',
+                'OTHER_DIRECTIVES',
+                'OTHER_ATTR',
+                'EVENTS',
+                'CONTENT',
+            ],
+        }],
+        'vue/brace-style': ['error', '1tbs'],
+        'vue/comma-dangle': ['error', {
+            arrays: 'always-multiline',
+            exports: 'always-multiline',
+            functions: 'never',
+            imports: 'always-multiline',
+            objects: 'always-multiline',
+        }],
+        'vue/comma-spacing': ['error'],
+        'vue/comma-style': ['error', 'last'],
+        'vue/component-definition-name-casing': ['error', 'PascalCase'],
+        'vue/component-name-in-template-casing': ['error', 'PascalCase', {
+            registeredComponentsOnly: false,
+            ignores: [
+                'component',
+                'transition',
+            ],
+        }],
+        'vue/component-tags-order': ['error', {
+            order: [
+                'script[setup]',
+                'template',
+                'script:not([setup])',
+                'style',
+            ],
+        }],
+        'vue/dot-location': ['error'],
+        'vue/dot-notation': ['error'],
+        'vue/eqeqeq': ['error'],
+        'vue/func-call-spacing': ['error'],
+        'vue/html-closing-bracket-newline': ['error', {
+            multiline: 'never',
+            singleline: 'never',
+        }],
+        'vue/html-end-tags': ['error'],
+        'vue/html-indent': ['error', 4],
+        'vue/html-quotes': ['error', 'double'],
+        'vue/html-self-closing': ['error'],
+        'vue/html-closing-bracket-spacing': ['error'],
+        'vue/key-spacing': ['error'],
+        'vue/keyword-spacing': ['error'],
+        'vue/max-attributes-per-line': ['error', {
+            multiline: {
+                max: 1,
+            },
+            singleline: 1,
+        }],
+        'vue/max-len': ['error', 120, {
+            ignoreComments: true,
+            ignoreRegExpLiterals: true,
+            ignoreTemplateLiterals: true,
+            ignoreTrailingComments: true,
+            ignoreUrls: true,
+        }],
+        'vue/multi-word-component-names': 'off',
+        'vue/mustache-interpolation-spacing': ['error', 'always'],
+        'vue/no-bare-strings-in-template': ['error'],
+        'vue/no-constant-condition': ['error'],
+        'vue/no-empty-component-block': ['error'],
+        'vue/no-empty-pattern': ['error'],
+        'vue/no-extra-parens': ['error'],
+        'vue/no-irregular-whitespace': ['error'],
+        'vue/no-multi-spaces': ['error'],
+        'vue/no-multiple-objects-in-class': ['error'],
+        'vue/no-potential-component-option-typo': ['error'],
+        'vue/no-reserved-component-names': ['error'],
+        'vue/no-restricted-syntax': ['error'],
+        'vue/no-spaces-around-equal-signs-in-attribute': ['error'],
+        'vue/no-sparse-arrays': ['error'],
+        'vue/no-undef-components': ['error'],
+        'vue/no-unsupported-features': ['error'],
+        'vue/no-unused-properties': ['error'],
+        'vue/no-unused-refs': ['error'],
+        'vue/no-use-computed-property-like-method': ['error'],
+        'vue/no-use-v-if-with-v-for': 'error',
+        'vue/no-useless-concat': ['error'],
+        'vue/no-useless-mustaches': ['error'],
+        'vue/no-useless-v-bind': ['error'],
+        'vue/no-v-text': ['error'],
+        'vue/object-curly-newline': ['error', {
+            consistent: true,
+        }],
+        'vue/object-curly-spacing': ['error', 'always'],
+        'vue/object-property-newline': ['error', {
+            allowAllPropertiesOnSameLine: true,
+        }],
+        'vue/object-shorthand': ['error', 'always'],
+        'vue/order-in-components': ['error', {
+            order: [
+                'el',
+                'name',
+                'parent',
+                'functional',
+                ['delimiters', 'comments'],
+                ['components', 'directives', 'filters'],
+                'extends',
+                'mixins',
+                'inheritAttrs',
+                'model',
+                ['props', 'propsData'],
+                'data',
+                'computed',
+                'watch',
+                'LIFECYCLE_HOOKS',
+                'methods',
+                ['template', 'render'],
+                'renderError',
+            ],
+        }],
+        'vue/padding-line-between-blocks': ['error'],
+        'vue/prefer-separate-static-class': ['error'],
+        'vue/prefer-template': ['error'],
+        'vue/prefer-true-attribute-shorthand': ['error'],
+        'vue/prop-name-casing': ['error', 'camelCase'],
+        'vue/quote-props': ['error', 'as-needed'],
+        'vue/require-default-prop': ['error'],
+        'vue/require-prop-type-constructor': 'error',
+        'vue/require-prop-types': ['error'],
+        'vue/script-indent': ['error', 4, {
+            switchCase: 1,
+        }],
+        'vue/space-in-parens': ['error', 'never'],
+        'vue/space-infix-ops': ['error'],
+        'vue/space-unary-ops': ['error'],
+        'vue/template-curly-spacing': ['error'],
+        'vue/this-in-template': ['error', 'never'],
+        'vue/v-bind-style': ['error', 'shorthand'],
+        'vue/v-on-function-call': 'off',
+        'vue/v-on-style': ['error', 'shorthand'],
+        'vue/v-on-event-hyphenation': 'off',
+        'vue/no-setup-props-destructure': 'off',
+        'vue/block-tag-newline': ['error', {
+            singleline: 'always',
+            multiline: 'always',
+        }],
+        'vue/require-explicit-emits': ['error'],
+        'vue/no-required-prop-with-default': ['error'],
+        'vue/no-ref-object-destructure': ['error'],
+        'vue/no-template-target-blank': ['error'],
+        'vue/define-emits-declaration': ['error', 'type-based'],
+        'vue/define-props-declaration': ['error', 'type-based'],
     },
 };

package/src/typescript/index.cjs

@@ -28,6 +28,8 @@ module.exports = {
         'jsdoc/require-param': 'off',
         'jsdoc/require-jsdoc': 'off',
         'jsdoc/require-returns': 'off',
+        'jsdoc/require-param-type': 'off',
+        'jsdoc/check-param-names': 'off',
     },
     settings: {
         jsdoc: {

package/src/typescript-dom/README.md

@@ -62,3 +62,24 @@ module.exports = {
   ],
 };
 ```
+
+### Vue Extension Configuration
+
+To properly lint `.vue` files imported within `.ts` files, it's essential to
+update the `parserOptions` in your ESLint configuration. This adjustment helps
+prevent ESLint errors that may arise due to the import of Vue components. Add
+the following configuration to your `.eslintrc` file:
+
+```js
+{
+  // Existing configuration...
+  parserOptions: {
+    // Other existing parser options...
+    extraFileExtensions: ['.vue'], // Add this line
+  },
+},
+```
+
+This change ensures that ESLint correctly processes .vue files alongside
+TypeScript files, maintaining consistent code quality and style across your
+project.

package/src/typescript-dom/index.cjs

@@ -26,12 +26,13 @@ module.exports = {
         ecmaFeatures: {
             jsx: true,
         },
-        extraFileExtensions: ['.vue'],
     },
     rules: {
         'jsdoc/require-param': 'off',
         'jsdoc/require-jsdoc': 'off',
         'jsdoc/require-returns': 'off',
+        'jsdoc/require-param-type': 'off',
+        'jsdoc/check-param-names': 'off',
     },
     settings: {
         jsdoc: {

package/src/vue3-typescript/index.cjs

@@ -30,4 +30,20 @@ module.exports = {
         },
         extraFileExtensions: ['.vue'],
     },
+    rules: {
+        'jsdoc/require-param': 'off',
+        'jsdoc/require-jsdoc': 'off',
+        'jsdoc/require-returns': 'off',
+        'jsdoc/require-param-type': 'off',
+        'jsdoc/check-param-names': 'off',
+    },
+    settings: {
+        jsdoc: {
+            mode: 'typescript',
+            tagNamePreference: {
+                callback: 'watch',
+                desc: 'use',
+            },
+        },
+    },
 };