@nitra/eslint-config 3.4.3 → 3.4.8

package/graphql-eslint-anchor.js

@@ -0,0 +1,137 @@
+/**
+ * Обхід обмеження graphql-eslint: loadOnDiskGraphQLConfig(filePath) для віртуальних
+ * шляхів виду …/Component.vue/…/script.js має отримувати шлях до фізичного .vue, інакше rootDir
+ * стає некоректним і eslint не бачить схему з .graphqlrc.yml.
+ * @see upstream graphql-eslint (MIT) on GitHub
+ */
+import { relative } from 'node:path'
+import { gqlPluckFromCodeStringSync } from '@graphql-tools/graphql-tag-pluck'
+import { asArray } from '@graphql-tools/utils'
+import graphqlEslintPlugin from '@graphql-eslint/eslint-plugin'
+import { loadOnDiskGraphQLConfig } from '@graphql-eslint/eslint-plugin/graphql-config'
+import { version } from '@graphql-eslint/eslint-plugin/meta'
+import { CWD, REPORT_ON_FIRST_CHARACTER } from '@graphql-eslint/eslint-plugin/utils'
+
+const blocksMap = /* @__PURE__ */ new Map()
+let onDiskConfig
+let onDiskConfigLoaded = false
+const RELEVANT_KEYWORDS = ['gql', 'graphql', 'GraphQL']
+
+/**
+ * Шлях для graphql-config: для віртуальних блоків Vue — фізичний .vue, інакше той самий filePath.
+ * @param {string} filePath шлях файлу, який обробляє processor
+ * @returns {string} шлях для loadOnDiskGraphQLConfig та getProjectForFile
+ */
+export function graphQLConfigPathAnchor(filePath = '') {
+  if (filePath.includes('.vue/')) {
+    return filePath.slice(0, filePath.indexOf('.vue/') + '.vue'.length)
+  }
+  return filePath
+}
+
+/** Processor як у graphql-eslint, зі стабільним anchor для graphql-config. */
+export const graphqlCodefileProcessor = {
+  meta: {
+    name: '@nitra/graphql-codefile-processor',
+    version
+  },
+  supportsAutofix: true,
+  preprocess(code, filePath) {
+    if (process.env.ESLINT_USE_FLAT_CONFIG !== 'false' && filePath.endsWith('.vue')) {
+      throw new Error(
+        'Processing of `.vue` files is no longer supported, follow the new official vue example for ESLint flat config https://github.com/graphql-hive/graphql-eslint/tree/master/examples/vue-code-file'
+      )
+    }
+    if (!onDiskConfigLoaded) {
+      onDiskConfig = loadOnDiskGraphQLConfig(graphQLConfigPathAnchor(filePath))
+      onDiskConfigLoaded = true
+    }
+    let keywords = RELEVANT_KEYWORDS
+    const anchor = graphQLConfigPathAnchor(filePath)
+    const pluckConfig = onDiskConfig?.getProjectForFile(anchor)?.extensions?.pluckConfig
+    if (pluckConfig) {
+      const { modules = [], globalGqlIdentifierName = ['gql', 'graphql'], gqlMagicComment = 'GraphQL' } = pluckConfig
+      const mods = modules.map(({ identifier }) => identifier).filter(v => !!v)
+      const result = [...mods, ...asArray(globalGqlIdentifierName), gqlMagicComment]
+      keywords = [...new Set(result)]
+    }
+    if (keywords.every(keyword => !code.includes(keyword))) {
+      return [code]
+    }
+    try {
+      const sources = gqlPluckFromCodeStringSync(filePath, code, {
+        skipIndent: true,
+        ...pluckConfig
+      })
+      const blocks = sources.map(item => ({
+        filename: 'document.graphql',
+        text: item.body,
+        lineOffset: item.locationOffset.line - 1,
+        offset: item.locationOffset.index + 1
+      }))
+      blocksMap.set(filePath, blocks)
+      return [...blocks, code]
+    } catch (error) {
+      if (error instanceof Error) {
+        error.message = `[graphql-eslint] Error while preprocessing "${relative(CWD, filePath)}" file
+
+${error.message}`
+      }
+      console.error(error)
+      return [code]
+    }
+  },
+  postprocess(messages, filePath) {
+    const blocks = blocksMap.get(filePath) || []
+    for (const [i, block] of blocks.entries()) {
+      const { lineOffset, offset } = block
+      for (const message of messages[i] || []) {
+        const isVueOrSvelte = /\.(vue|svelte)$/.test(filePath)
+        if (isVueOrSvelte) {
+          delete message.endLine
+          delete message.endColumn
+          delete message.fix
+          delete message.suggestions
+          Object.assign(message, REPORT_ON_FIRST_CHARACTER)
+          continue
+        }
+        message.line += lineOffset
+        if (typeof message.endLine === 'number') {
+          message.endLine += lineOffset
+        }
+        if (message.fix) {
+          message.fix.range[0] += offset
+          message.fix.range[1] += offset
+        }
+        for (const suggestion of message.suggestions || []) {
+          const [start, end] = suggestion.fix.range
+          suggestion.fix.range = [start + offset, end + offset]
+        }
+      }
+    }
+    const result = messages.flat()
+    return result.toSorted((a, b) => a.line - b.line || a.column - b.column)
+  }
+}
+
+const baseParser = graphqlEslintPlugin.parser
+
+/**
+ * Парсер graphql-eslint: той самий anchor для filePath, щоб loadGraphQLConfig знаходив проєкт для віртуальних document.graphql з-під Vue.
+ * @param {string} code вміст GraphQL-документа
+ * @param {import('eslint').Linter.ParserOptions} options опції ESLint (filePath тощо)
+ * @returns {ReturnType<typeof baseParser.parseForESLint>} AST і parserServices для graphql-eslint
+ */
+export function graphqlParseForESLintWithAnchor(code, options = {}) {
+  const filePath = options.filePath || ''
+  return baseParser.parseForESLint(code, {
+    ...options,
+    filePath: graphQLConfigPathAnchor(filePath)
+  })
+}
+
+/** Парсер для flat config (обгортка над graphql-eslint). */
+export const graphqlParserWithConfigAnchor = {
+  meta: baseParser.meta,
+  parseForESLint: graphqlParseForESLintWithAnchor
+}

package/index.js

@@ -1,4 +1,7 @@
+import { fixupPluginRules } from '@eslint/compat'
 import js from '@eslint/js'
+import graphqlEslintPlugin from '@graphql-eslint/eslint-plugin'
+import { graphqlCodefileProcessor, graphqlParserWithConfigAnchor } from './graphql-eslint-anchor.js'
 import microsoftSdl from '@microsoft/eslint-plugin-sdl'
 import { flatConfigs as importPlugin } from 'eslint-plugin-import'
 import jsdocPlugin from 'eslint-plugin-jsdoc'
@@ -10,11 +13,58 @@ import securityPlugin from 'eslint-plugin-security'
 import unicornPlugin from 'eslint-plugin-unicorn'
 import vuePlugin from 'eslint-plugin-vue'
 import { configs as ymlConfigs } from 'eslint-plugin-yml'
+import { mergeProcessors } from 'eslint-merge-processors'
+import processorVueBlocks from 'eslint-processor-vue-blocks'
 import globals from 'globals'
 
 /** Glob-патерни файлів для eslint-plugin-unicorn (JS-подібні джерела; без сирих YAML/Markdown). */
 const UNICORN_FILES = ['**/*.{js,mjs,cjs,vue}']
 
+/** Віртуальні документи з gql/graphql у .js/.vue (processor); ESLint обробляє їх як окремі `*.graphql` файли. */
+const GRAPHQL_EXTRACTED_DOCUMENT_FILES = ['**/*.graphql']
+
+/**
+ * Правила для витягнутих GraphQL-блоків: пресет operations-recommended (поля, типи, змінні).
+ * Схема та documents підтягуються через graphql-config (файл налаштувань у корені пакета з операціями, зазвичай YAML).
+ */
+const graphqlExtractedDocumentLint = {
+  files: GRAPHQL_EXTRACTED_DOCUMENT_FILES,
+  languageOptions: {
+    parser: graphqlParserWithConfigAnchor
+  },
+  plugins: {
+    // ESLint 10: graphql-eslint ще викликає context.getSourceCode() у частині правил — fixup з @eslint/compat.
+    '@graphql-eslint': fixupPluginRules(graphqlEslintPlugin)
+  },
+  rules: {
+    ...graphqlEslintPlugin.configs['flat/operations-recommended'].rules
+  }
+}
+
+/**
+ * Вимкнення unique-operation-name лише для віртуальних документів з-під SFC: mergeProcessors дає кілька
+ * блоків script/template з одного `.vue`, graphql-eslint витягує gql з кожного — хибні «дублікати» імені.
+ * Шляхи виглядають як `…/Component.vue/1_script.js/0_document.graphql` (див. debug ESLint `eslint:linter`).
+ */
+const graphqlExtractedDocumentLintVueUniqueOperationOverride = {
+  files: ['**/*.vue/**/*.graphql'],
+  rules: {
+    '@graphql-eslint/unique-operation-name': 'off'
+  }
+}
+
+/** Processor для .vue у flat config: vue + віртуальні JS-блоки для graphql-eslint (офіційний приклад). */
+const vueGraphqlMergedProcessor = mergeProcessors([
+  vuePlugin.processors.vue,
+  processorVueBlocks({
+    blocks: {
+      script: true,
+      scriptSetup: true,
+      customBlocks: true
+    }
+  })
+])
+
 /**
  * Обмежує масив flat-конфігів ESLint заданими `files` (копія кожного елемента).
  * @param {import('eslint').Linter.FlatConfig[]} configs вхідні конфіги
@@ -37,7 +87,7 @@ const importPluginEcmaLatest = {
 const all = [
   {
     // До дефолтних "**/node_modules/", ".git/" додаємо
-    ignores: ['.yarn/**', '**/dist/**']
+    ignores: ['.yarn/**', '**/dist/**', '**/schema.graphql']
   },
   // Загальні правила для всіх Yaml файлів проекту
   ...ymlConfigs['flat/recommended'],
@@ -219,6 +269,37 @@ const vue2 = [
   }
 ]
 
+/**
+ * Увімкнути graphql-eslint processor лише для .js (gql у коді).
+ * @param {import('eslint').Linter.FlatConfig[]} result масив конфігів
+ * @param {string[]} dirs кореневі директорії
+ */
+function pushGraphqlJsProcessors(result, dirs) {
+  if (!dirs?.length) {
+    return
+  }
+  result.push({
+    files: dirs.map(name => `${name}/**/*.js`),
+    processor: graphqlCodefileProcessor
+  })
+}
+
+/**
+ * Merge processor для .vue (vue + vue-blocks + graphql) — має бути останнім серед конфігів для `*.vue`,
+ * інакше пресет eslint-plugin-vue (`processor: "vue/vue"`) перезапише його.
+ * @param {import('eslint').Linter.FlatConfig[]} result масив конфігів
+ * @param {string[]} dirs кореневі директорії Vue-пакетів
+ */
+function pushGraphqlVueMergedProcessorLast(result, dirs) {
+  if (!dirs?.length) {
+    return
+  }
+  result.push({
+    files: dirs.map(name => `${name}/**/*.vue`),
+    processor: vueGraphqlMergedProcessor
+  })
+}
+
 /**
  * Додає до result конфіги для Vue-проєктів (vite, .vue, .js).
  * @param {import('eslint').Linter.FlatConfig[]} result масив конфігів
@@ -252,6 +333,9 @@ function pushVueConfigs(result, dirs, options = {}) {
 // oxlint-disable-next-line unicorn/no-object-as-default-parameter
 export function getConfig(params = { node: [], vue: [], vue2: [] }) {
   const result = [...all]
+  let graphqlCodefile = false
+  /** Директорії Vue/Vue2, для яких потрібен merge processor після oxlint. */
+  const graphqlVueDirsLast = []
 
   if (params.node?.length) {
     const files = params.node.map(name => `${name}/**/*.js`)
@@ -259,16 +343,37 @@ export function getConfig(params = { node: [], vue: [], vue2: [] }) {
       ...node.map(configObject => ({ files, ...configObject })),
       ...flatConfigsWithFiles(microsoftSdlNodeConfigsWithoutN, files)
     )
+    // Каталог `npm` пакета конфігу зазвичай без graphql-config; перший preprocess інакше кешує null і ламає демо/vue.
+    const graphqlNodeDirs = params.node.filter(d => d !== 'npm')
+    if (graphqlNodeDirs.length) {
+      pushGraphqlJsProcessors(result, graphqlNodeDirs)
+      graphqlCodefile = true
+    }
   }
 
   if (params.vue?.length) {
     pushVueConfigs(result, params.vue, { includeVite: true })
+    pushGraphqlJsProcessors(result, params.vue)
+    graphqlVueDirsLast.push(...params.vue)
+    graphqlCodefile = true
   }
 
   if (params.vue2?.length) {
     pushVueConfigs(result, params.vue2, { extraVueConfigs: vue2 })
+    pushGraphqlJsProcessors(result, params.vue2)
+    graphqlVueDirsLast.push(...params.vue2)
+    graphqlCodefile = true
+  }
+
+  if (graphqlCodefile) {
+    result.push(graphqlExtractedDocumentLint, graphqlExtractedDocumentLintVueUniqueOperationOverride)
   }
 
   result.push(...oxlint.configs['flat/recommended'])
+
+  if (graphqlVueDirsLast.length) {
+    pushGraphqlVueMergedProcessorLast(result, graphqlVueDirsLast)
+  }
+
   return result
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nitra/eslint-config",
-  "version": "3.4.3",
+  "version": "3.4.8",
   "description": "An ESLint shareable config for projects using Vue and Node",
   "keywords": [
     "eslint",
@@ -14,6 +14,7 @@
     "url": "git@github.com:nitra/eslint-config.git"
   },
   "files": [
+    "graphql-eslint-anchor.js",
     "index.d.ts",
     "index.js"
   ],
@@ -21,20 +22,27 @@
   "types": "./index.d.ts",
   "exports": "./index.js",
   "dependencies": {
+    "@eslint/compat": "^2.0.5",
     "@eslint/js": "^10.0.1",
+    "@graphql-eslint/eslint-plugin": "^4.4.0",
+    "@graphql-tools/graphql-tag-pluck": "^8.3.4",
+    "@graphql-tools/utils": "^10.0.0",
     "@microsoft/eslint-plugin-sdl": "^1.1.0",
     "eslint": "^10.2.0",
+    "eslint-merge-processors": "^2.0.0",
     "eslint-plugin-import": "^2.32.0",
     "eslint-plugin-jsdoc": "^62.9.0",
     "eslint-plugin-jsonc": "^3.1.2",
     "eslint-plugin-markdown": "^5.1.0",
     "eslint-plugin-n": "^17.24.0",
-    "eslint-plugin-oxlint": "^1.58.0",
+    "eslint-plugin-oxlint": "^1.59.0",
     "eslint-plugin-security": "^4.0.0",
     "eslint-plugin-unicorn": "^64.0.0",
     "eslint-plugin-vue": "^10.8.0",
     "eslint-plugin-yml": "^3.3.1",
-    "globals": "^17.4.0",
+    "eslint-processor-vue-blocks": "^2.0.0",
+    "globals": "^17.5.0",
+    "graphql": "^16.11.0",
     "vue-eslint-parser": "^10.4.0"
   },
   "engines": {