[Eslint] Add support for mjs and cjs, format config

This commit is contained in:
Janis Hutz 2025-06-06 11:46:57 +02:00
parent 8b7f15eddf
commit 1f460ccc38
3 changed files with 438 additions and 89 deletions

View File

@ -11,57 +11,159 @@ const style = {
'@stylistic/js': stylistic, '@stylistic/js': stylistic,
'@stylistic/ts': stylistic, '@stylistic/ts': stylistic,
}, },
'files': [ '**/*.ts', '**/*.js', '**/*.tsx', '**/*.jsx' ], 'files': [
'**/*.ts',
'**/*.js',
'**/*.mjs',
'**/*.cjs',
'**/*.tsx',
'**/*.jsx'
],
'rules': { 'rules': {
// Formatting // Formatting
'@stylistic/array-bracket-newline': ['error', { 'multiline': true, 'minItems': 2 }], '@stylistic/array-bracket-newline': [
'@stylistic/array-bracket-spacing': ['error', 'always'], 'error',
'@stylistic/array-element-newline': ['error', { 'multiline': true, 'minItems': 2 }], {
'@stylistic/arrow-parens': ['error', 'as-needed'], 'multiline': true,
'@stylistic/arrow-spacing': ['error', { 'before': true, 'after': true }], 'minItems': 2
'@stylistic/block-spacing': ['error', 'always'], }
'@stylistic/brace-style': ['error', '1tbs'], ],
'@stylistic/comma-spacing': ['error', { 'before': false, 'after': true }], '@stylistic/array-bracket-spacing': [
'@stylistic/comma-style': ['error', 'last'], 'error',
'@stylistic/dot-location': ['error', 'property'], 'always'
'@stylistic/eol-last': ['error', 'always'], ],
'@stylistic/function-call-spacing': ['error', 'never'], '@stylistic/array-element-newline': [
'@stylistic/implicit-arrow-linebreak': ['error', 'beside'], 'error',
'@stylistic/indent': ['error', 4], {
'@stylistic/key-spacing': ['error', { 'beforeColon': false, 'afterColon': true }], 'multiline': true,
'@stylistic/keyword-spacing': ['error', { 'before': true, 'after': true }], 'minItems': 2
'@stylistic/lines-between-class-members': ['error', 'always'], }
'@stylistic/new-parens': ['error', 'always'], ],
'@stylistic/newline-per-chained-call': ['error', { '@stylistic/arrow-parens': [
'ignoreChainWithDepth': 2 'error',
}], 'as-needed'
'@stylistic/no-extra-parens': ['error', 'all'], ],
'@stylistic/arrow-spacing': [
'error',
{
'before': true,
'after': true
}
],
'@stylistic/block-spacing': [
'error',
'always'
],
'@stylistic/brace-style': [
'error',
'1tbs'
],
'@stylistic/comma-spacing': [
'error',
{
'before': false,
'after': true
}
],
'@stylistic/comma-style': [
'error',
'last'
],
'@stylistic/dot-location': [
'error',
'property'
],
'@stylistic/eol-last': [
'error',
'always'
],
'@stylistic/function-call-spacing': [
'error',
'never'
],
'@stylistic/implicit-arrow-linebreak': [
'error',
'beside'
],
'@stylistic/indent': [
'error',
4
],
'@stylistic/key-spacing': [
'error',
{
'beforeColon': false,
'afterColon': true
}
],
'@stylistic/keyword-spacing': [
'error',
{
'before': true,
'after': true
}
],
'@stylistic/lines-between-class-members': [
'error',
'always'
],
'@stylistic/new-parens': [
'error',
'always'
],
'@stylistic/newline-per-chained-call': [
'error',
{ 'ignoreChainWithDepth': 2 }
],
'@stylistic/no-extra-parens': [
'error',
'all'
],
'@stylistic/no-extra-semi': 'error', '@stylistic/no-extra-semi': 'error',
'@stylistic/no-floating-decimal': 'error', '@stylistic/no-floating-decimal': 'error',
'@stylistic/no-mixed-operators': 'error', '@stylistic/no-mixed-operators': 'error',
'@stylistic/no-mixed-spaces-and-tabs': 'error', '@stylistic/no-mixed-spaces-and-tabs': 'error',
'@stylistic/no-multi-spaces': 'error', '@stylistic/no-multi-spaces': 'error',
'@stylistic/no-multiple-empty-lines': ['error', { '@stylistic/no-multiple-empty-lines': [
'max': 3, 'error',
'maxEOF': 1 {
}], 'max': 3,
'maxEOF': 1
}
],
'@stylistic/no-tabs': 'error', '@stylistic/no-tabs': 'error',
'@stylistic/no-trailing-spaces': 'error', '@stylistic/no-trailing-spaces': 'error',
'@stylistic/no-whitespace-before-property': 'error', '@stylistic/no-whitespace-before-property': 'error',
'@stylistic/object-curly-newline': ['error', { 'multiline': true, 'minProperties': 2 }], '@stylistic/object-curly-newline': [
'@stylistic/object-curly-spacing': ['error', 'always'], 'error',
{
'multiline': true,
'minProperties': 2
}
],
'@stylistic/object-curly-spacing': [
'error',
'always'
],
'@stylistic/object-property-newline': 'error', '@stylistic/object-property-newline': 'error',
'@stylistic/operator-linebreak': ['error', 'before'], '@stylistic/operator-linebreak': [
'error',
'before'
],
'@stylistic/one-var-declaration-per-line': 'error', '@stylistic/one-var-declaration-per-line': 'error',
'@stylistic/padded-blocks': ['error', { '@stylistic/padded-blocks': [
'blocks': 'never', 'error',
'classes': 'always', {
'switches': 'never', 'blocks': 'never',
}], 'classes': 'always',
'switches': 'never',
}
],
// Padding lines. The most in-depth part of this config // Padding lines. The most in-depth part of this config
// ['block', 'block-like', 'break', 'cjs-export', 'cjs-import', 'class', 'const', 'continue', 'debugger', 'directive', 'do', 'empty', 'export', 'expression', 'for', 'function', 'if', 'iife', 'import', 'let', 'return', 'switch', 'throw', 'try', 'var', 'while', 'with'] // ['block', 'block-like', 'break', 'cjs-export', 'cjs-import', 'class', 'const', 'continue', 'debugger', 'directive', 'do', 'empty', 'export', 'expression', 'for', 'function', 'if', 'iife', 'import', 'let', 'return', 'switch', 'throw', 'try', 'var', 'while', 'with']
'@stylistic/padding-line-between-statements': ['error', '@stylistic/padding-line-between-statements': [
'error',
// Variables, Constants // Variables, Constants
{ {
'blankLine': 'never', 'blankLine': 'never',
@ -81,17 +183,98 @@ const style = {
{ {
'blankLine': 'always', 'blankLine': 'always',
'prev': 'var', 'prev': 'var',
'next': ['block', 'block-like', 'break', 'cjs-export', 'cjs-import', 'class', 'const', 'continue', 'debugger', 'directive', 'do', 'empty', 'export', 'expression', 'for', 'function', 'if', 'iife', 'import', 'let', 'return', 'switch', 'throw', 'try', 'var', 'with'] 'next': [
'block',
'block-like',
'break',
'cjs-export',
'cjs-import',
'class',
'const',
'continue',
'debugger',
'directive',
'do',
'empty',
'export',
'expression',
'for',
'function',
'if',
'iife',
'import',
'let',
'return',
'switch',
'throw',
'try',
'var',
'with'
]
}, },
{ {
'blankLine': 'always', 'blankLine': 'always',
'prev': 'let', 'prev': 'let',
'next': ['block', 'block-like', 'break', 'cjs-export', 'cjs-import', 'class', 'const', 'continue', 'debugger', 'directive', 'do', 'empty', 'export', 'expression', 'for', 'function', 'if', 'iife', 'import', 'return', 'switch', 'throw', 'try', 'var', 'while', 'with'] 'next': [
'block',
'block-like',
'break',
'cjs-export',
'cjs-import',
'class',
'const',
'continue',
'debugger',
'directive',
'do',
'empty',
'export',
'expression',
'for',
'function',
'if',
'iife',
'import',
'return',
'switch',
'throw',
'try',
'var',
'while',
'with'
]
}, },
{ {
'blankLine': 'always', 'blankLine': 'always',
'prev': 'const', 'prev': 'const',
'next': ['block', 'block-like', 'break', 'cjs-export', 'cjs-import', 'class', 'continue', 'debugger', 'directive', 'do', 'empty', 'export', 'expression', 'for', 'function', 'if', 'iife', 'import', 'let', 'return', 'switch', 'throw', 'try', 'var', 'while', 'with'] 'next': [
'block',
'block-like',
'break',
'cjs-export',
'cjs-import',
'class',
'continue',
'debugger',
'directive',
'do',
'empty',
'export',
'expression',
'for',
'function',
'if',
'iife',
'import',
'let',
'return',
'switch',
'throw',
'try',
'var',
'while',
'with'
]
}, },
// Import // Import
{ {
@ -106,23 +289,127 @@ const style = {
}, },
{ {
'blankLine': 'always', 'blankLine': 'always',
'prev': ['block', 'block-like', 'break', 'cjs-export', 'class', 'const', 'continue', 'debugger', 'directive', 'do', 'empty', 'export', 'expression', 'for', 'function', 'if', 'iife', 'let', 'return', 'switch', 'throw', 'try', 'var', 'while', 'with'], 'prev': [
'block',
'block-like',
'break',
'cjs-export',
'class',
'const',
'continue',
'debugger',
'directive',
'do',
'empty',
'export',
'expression',
'for',
'function',
'if',
'iife',
'let',
'return',
'switch',
'throw',
'try',
'var',
'while',
'with'
],
'next': 'cjs-import' 'next': 'cjs-import'
}, },
{ {
'blankLine': 'always', 'blankLine': 'always',
'prev': 'cjs-import', 'prev': 'cjs-import',
'next': ['block', 'block-like', 'break', 'cjs-export', 'class', 'const', 'continue', 'debugger', 'directive', 'do', 'empty', 'export', 'expression', 'for', 'function', 'if', 'iife', 'let', 'return', 'switch', 'throw', 'try', 'var', 'while', 'with'] 'next': [
'block',
'block-like',
'break',
'cjs-export',
'class',
'const',
'continue',
'debugger',
'directive',
'do',
'empty',
'export',
'expression',
'for',
'function',
'if',
'iife',
'let',
'return',
'switch',
'throw',
'try',
'var',
'while',
'with'
]
}, },
{ {
'blankLine': 'always', 'blankLine': 'always',
'prev': ['block', 'block-like', 'break', 'cjs-export', 'class', 'const', 'continue', 'debugger', 'directive', 'do', 'empty', 'export', 'expression', 'for', 'function', 'if', 'iife', 'let', 'return', 'switch', 'throw', 'try', 'var', 'while', 'with'], 'prev': [
'block',
'block-like',
'break',
'cjs-export',
'class',
'const',
'continue',
'debugger',
'directive',
'do',
'empty',
'export',
'expression',
'for',
'function',
'if',
'iife',
'let',
'return',
'switch',
'throw',
'try',
'var',
'while',
'with'
],
'next': 'import' 'next': 'import'
}, },
{ {
'blankLine': 'always', 'blankLine': 'always',
'prev': 'import', 'prev': 'import',
'next': ['block', 'block-like', 'break', 'cjs-export', 'class', 'const', 'continue', 'debugger', 'directive', 'do', 'empty', 'export', 'expression', 'for', 'function', 'if', 'iife', 'let', 'return', 'switch', 'throw', 'try', 'var', 'while', 'with'] 'next': [
'block',
'block-like',
'break',
'cjs-export',
'class',
'const',
'continue',
'debugger',
'directive',
'do',
'empty',
'export',
'expression',
'for',
'function',
'if',
'iife',
'let',
'return',
'switch',
'throw',
'try',
'var',
'while',
'with'
]
}, },
// If // If
{ {
@ -256,26 +543,67 @@ const style = {
'next': '*' 'next': '*'
}, },
], ],
'@stylistic/quote-props': ['error', 'always'], '@stylistic/quote-props': [
'@stylistic/quotes': ['error', 'single'], 'error',
'@stylistic/rest-spread-spacing': ['error', 'never'], 'always'
'@stylistic/semi': ['error', 'always'], ],
'@stylistic/semi-spacing': ['error', { 'before': false, 'after': true }], '@stylistic/quotes': [
'@stylistic/semi-style': ['error', 'last'], 'error',
'@stylistic/space-before-blocks': ['error', 'always'], 'single'
'@stylistic/space-before-function-paren': ['error', 'always'], ],
'@stylistic/space-in-parens': ['error', 'always'], '@stylistic/rest-spread-spacing': [
'@stylistic/space-infix-ops': ['error', { 'int32Hint': false }], 'error',
'never'
],
'@stylistic/semi': [
'error',
'always'
],
'@stylistic/semi-spacing': [
'error',
{
'before': false,
'after': true
}
],
'@stylistic/semi-style': [
'error',
'last'
],
'@stylistic/space-before-blocks': [
'error',
'always'
],
'@stylistic/space-before-function-paren': [
'error',
'always'
],
'@stylistic/space-in-parens': [
'error',
'always'
],
'@stylistic/space-infix-ops': [
'error',
{ 'int32Hint': false }
],
'@stylistic/space-unary-ops': 'error', '@stylistic/space-unary-ops': 'error',
'@stylistic/spaced-comment': ['error', 'always'], '@stylistic/spaced-comment': [
'@stylistic/template-curly-spacing': ['error', 'always'], 'error',
'always'
],
'@stylistic/template-curly-spacing': [
'error',
'always'
],
'@stylistic/switch-colon-spacing': 'error', '@stylistic/switch-colon-spacing': 'error',
'@stylistic/template-curly-spacing': ['error', 'always'], '@stylistic/wrap-iife': [
'@stylistic/wrap-iife': ['error', 'inside'], 'error',
'inside'
],
'@stylistic/wrap-regex': 'error', '@stylistic/wrap-regex': 'error',
'@stylistic/ts/type-annotation-spacing': 'error', '@stylistic/ts/type-annotation-spacing': 'error',
} }
} };
/** @type {import('eslint').Linter.Config} */ /** @type {import('eslint').Linter.Config} */
export default tseslint.config( export default tseslint.config(
@ -286,51 +614,65 @@ export default tseslint.config(
// Vue support (including TS and JSX inside SFCs) // Vue support (including TS and JSX inside SFCs)
{ {
files: ['**/*.vue'], 'files': [ '**/*.vue' ],
languageOptions: { 'languageOptions': {
sourceType: 'module', 'sourceType': 'module',
ecmaVersion: 'latest', 'ecmaVersion': 'latest',
globals: globals.browser, 'globals': globals.browser,
parserOptions: { 'parserOptions': { 'parser': tseslint.parser, },
parser: tseslint.parser,
},
}, },
plugins: { 'plugins': {
'vue': vue, 'vue': vue,
'@stylistic': stylistic, '@stylistic': stylistic,
'@stylistic/js': stylistic, '@stylistic/js': stylistic,
'@stylistic/ts': stylistic, '@stylistic/ts': stylistic,
'@typescript-eslint': typescript, '@typescript-eslint': typescript,
}, },
extends: [ 'extends': [
eslint.configs.recommended, eslint.configs.recommended,
...vue.configs['flat/recommended'] ...vue.configs['flat/recommended']
], ],
rules: { 'rules': {
...typescript.configs.recommended.rules, ...typescript.configs.recommended.rules,
...style.rules, ...style.rules,
// Vue specific rules // Vue specific rules
'@stylistic/indent': 'off', '@stylistic/indent': 'off',
'vue/html-indent': ['error', 4], 'vue/html-indent': [
'vue/html-comment-indent': ['error', 4], 'error',
'vue/script-indent': ['error', 4, { 4
"baseIndent": 1, ],
"switchCase": 1 'vue/html-comment-indent': [
}], 'error',
'vue/html-self-closing': ['error', { 4
"html": { ],
"void": "never", 'vue/script-indent': [
"normal": "never", 'error',
"component": "always" 4,
}, {
"svg": "always", 'baseIndent': 1,
"math": "never" 'switchCase': 1
}], }
'vue/max-attributes-per-line': ['error', { ],
singleline: 3, 'vue/html-self-closing': [
multiline: 1, 'error',
}], {
'html': {
'void': 'never',
'normal': 'never',
'component': 'always'
},
'svg': 'always',
'math': 'never'
}
],
'vue/max-attributes-per-line': [
'error',
{
'singleline': 3,
'multiline': 1,
}
],
}, },
}, },
); );

8
config/lint/package.json Normal file
View File

@ -0,0 +1,8 @@
{
"devDependencies": {
"@eslint/js": "^9.28.0",
"@stylistic/eslint-plugin": "^4.4.1",
"eslint-plugin-vue": "^10.2.0",
"typescript-eslint": "^8.33.1"
}
}

View File

@ -4,6 +4,5 @@ SCRIPT_DIR=$(dirname "$0")
cp "$SCRIPT_DIR/../config/lint/eslint.config.mjs" . cp "$SCRIPT_DIR/../config/lint/eslint.config.mjs" .
# TODO: Improve eslint config to include JSX and Vue configs too, read on website
npm i --save-dev @eslint/js typescript-eslint @stylistic/eslint-plugin eslint-plugin-vue npm i --save-dev @eslint/js typescript-eslint @stylistic/eslint-plugin eslint-plugin-vue