Browse Source
* added sandpack linter and installed latest sandpacl * integrate eslint into Sandpack * Format the linting errors, disable preview on lint error, have only two react hooks * fixes build * split eslint-integration * fix tooltip text color, error rename to 'Lint Error', show single lint error * NIT * Just enable it * Delete eslint.md Co-authored-by: Strek <ssharishkumar@gmail.com> Co-authored-by: dan <dan.abramov@gmail.com>main
Danilo Woznica
3 years ago
committed by
GitHub
GitHub
8 changed files with 181 additions and 48 deletions
@ -0,0 +1,85 @@ |
|||||
|
// @ts-nocheck
|
||||
|
|
||||
|
import {Linter} from 'eslint/lib/linter/linter'; |
||||
|
|
||||
|
import type {Diagnostic} from '@codemirror/lint'; |
||||
|
import type {Text} from '@codemirror/text'; |
||||
|
|
||||
|
const getCodeMirrorPosition = ( |
||||
|
doc: Text, |
||||
|
{line, column}: {line: number; column?: number} |
||||
|
): number => { |
||||
|
return doc.line(line).from + (column ?? 0) - 1; |
||||
|
}; |
||||
|
|
||||
|
const linter = new Linter(); |
||||
|
|
||||
|
// HACK! Eslint requires 'esquery' using `require`, but there's no commonjs interop.
|
||||
|
// because of this it tries to run `esquery.parse()`, while there's only `esquery.default.parse()`.
|
||||
|
// This hack places the functions in the right place.
|
||||
|
const esquery = require('esquery'); |
||||
|
esquery.parse = esquery.default?.parse; |
||||
|
esquery.matches = esquery.default?.matches; |
||||
|
|
||||
|
const reactRules = require('eslint-plugin-react-hooks').rules; |
||||
|
linter.defineRules({ |
||||
|
'react-hooks/rules-of-hooks': reactRules['rules-of-hooks'], |
||||
|
'react-hooks/exhaustive-deps': reactRules['exhaustive-deps'], |
||||
|
}); |
||||
|
|
||||
|
const options = { |
||||
|
parserOptions: { |
||||
|
ecmaVersion: 12, |
||||
|
sourceType: 'module', |
||||
|
ecmaFeatures: {jsx: true}, |
||||
|
}, |
||||
|
rules: { |
||||
|
'react-hooks/rules-of-hooks': 'error', |
||||
|
'react-hooks/exhaustive-deps': 'warn', |
||||
|
}, |
||||
|
}; |
||||
|
|
||||
|
export const lintDiagnostic = ( |
||||
|
doc: Text |
||||
|
): {errors: any[]; codeMirrorPayload: Diagnostic[]} => { |
||||
|
const codeString = doc.toString(); |
||||
|
const errors = linter.verify(codeString, options) as any[]; |
||||
|
|
||||
|
const severity = { |
||||
|
1: 'warning', |
||||
|
2: 'error', |
||||
|
}; |
||||
|
|
||||
|
const codeMirrorPayload = errors |
||||
|
.map((error) => { |
||||
|
if (!error) return undefined; |
||||
|
|
||||
|
const from = getCodeMirrorPosition(doc, { |
||||
|
line: error.line, |
||||
|
column: error.column, |
||||
|
}); |
||||
|
|
||||
|
const to = getCodeMirrorPosition(doc, { |
||||
|
line: error.endLine ?? error.line, |
||||
|
column: error.endColumn ?? error.column, |
||||
|
}); |
||||
|
|
||||
|
return { |
||||
|
from, |
||||
|
to, |
||||
|
severity: severity[error.severity], |
||||
|
message: error.message, |
||||
|
}; |
||||
|
}) |
||||
|
.filter(Boolean) as Diagnostic[]; |
||||
|
|
||||
|
return { |
||||
|
codeMirrorPayload, |
||||
|
errors: errors.map((item) => { |
||||
|
return { |
||||
|
...item, |
||||
|
severity: severity[item.severity], |
||||
|
}; |
||||
|
}), |
||||
|
}; |
||||
|
}; |
||||
Loading…
Reference in new issue