extract GraphQL documents from *.vue/*.svelte code-files as well (#1200)

* support extracting GraphQL documents from `*.vue`/`*.svelte` code-files

* fix prettier

* adjust svelte location

Author: dimaMachina

.changeset/config.json

@@ -5,14 +5,13 @@
   "access": "restricted",
   "baseBranch": "master",
   "updateInternalDependencies": "patch",
-  "ignore": [
-    "@graphql-eslint/example-code-file",
-    "@graphql-eslint/example-basic",
-    "@graphql-eslint/example-graphql-config",
-    "@graphql-eslint/example-graphql-config-code-file",
-    "@graphql-eslint/example-prettier"
+  "ignore": ["@graphql-eslint/example-*"],
+  "changelog": [
+    "@changesets/changelog-github",
+    {
+      "repo": "B2o5T/graphql-eslint"
+    }
   ],
-  "changelog": ["@changesets/changelog-github", { "repo": "B2o5T/graphql-eslint" }],
   "snapshot": {
     "useCalculatedVersion": true,
     "prereleaseTemplate": "{tag}-{datetime}-{commit}"

.changeset/tame-baboons-retire.md

@@ -0,0 +1,5 @@
+---
+'@graphql-eslint/eslint-plugin': minor
+---
+
+support extracting GraphQL documents from `*.vue`/`*.svelte` code-files

.prettierrc.cjs

@@ -1,5 +1,5 @@
 module.exports = {
-  trailingComma: 'es5',
+  trailingComma: 'all',
   printWidth: 100,
   singleQuote: true,
   arrowParens: 'avoid',

examples/graphql-config-code-file/package.json

@@ -5,7 +5,7 @@
   "repository": "https://github.com/B2o5T/graphql-eslint",
   "author": "Dotan Simha <[email protected]>",
   "scripts": {
-    "lint": "eslint --ext graphql,js ."
+    "lint": "eslint ."
   },
   "dependencies": {
     "graphql": "16.6.0",

examples/monorepo/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "monorepo",
+  "name": "@graphql-eslint/example-monorepo",
   "version": "0.0.0",
   "private": true,
   "author": "Dimitri POSTOLOV",

examples/svelte-code-file/.eslintrc.cjs

@@ -0,0 +1,37 @@
+module.exports = {
+  root: true,
+  // ❗️ It's very important that you don't have any rules configured at the top-level config,
+  // and to move all configurations into the overrides section. Since JavaScript rules
+  // can't run on GraphQL files and vice versa, if you have rules configured at the top level,
+  // they will try to also execute for all overrides, as ESLint's configs cascade
+  overrides: [
+    {
+      files: ['*.js', '*.svelte'],
+      parser: 'svelte-eslint-parser',
+      processor: '@graphql-eslint/graphql',
+      extends: ['eslint:recommended'],
+      env: {
+        es6: true,
+      },
+    },
+    {
+      files: ['*.graphql'],
+      parser: '@graphql-eslint/eslint-plugin',
+      plugins: ['@graphql-eslint'],
+      rules: {
+        '@graphql-eslint/no-anonymous-operations': 'error',
+        '@graphql-eslint/no-duplicate-fields': 'error',
+        '@graphql-eslint/naming-convention': [
+          'error',
+          {
+            OperationDefinition: {
+              style: 'PascalCase',
+              forbiddenPrefixes: ['Query', 'Mutation', 'Subscription', 'Get'],
+              forbiddenSuffixes: ['Query', 'Mutation', 'Subscription'],
+            },
+          },
+        ],
+      },
+    },
+  ],
+};

examples/svelte-code-file/package.json

@@ -0,0 +1,19 @@
+{
+  "name": "@graphql-eslint/example-svelte-code-file",
+  "version": "0.0.0",
+  "private": true,
+  "author": "Dimitri POSTOLOV",
+  "scripts": {
+    "lint": "eslint ."
+  },
+  "dependencies": {
+    "graphql": "16.6.0"
+  },
+  "devDependencies": {
+    "@graphql-eslint/eslint-plugin": "3.11.2",
+    "eslint": "8.24.0",
+    "svelte": "3.50.1",
+    "svelte-eslint-parser": "0.18.4",
+    "svelte2tsx": "0.5.19"
+  }
+}

examples/svelte-code-file/test.svelte

@@ -0,0 +1,19 @@
+<script>
+/* eslint-disable no-unused-vars */
+
+const GET_USER = /* GraphQL */ `
+  query {
+    user {
+      name
+    }
+  }
+`;
+
+const GET_ANOTHER_USER = /* GraphQL */ `
+  query UserQuery {
+    user {
+      name
+    }
+  }
+`;
+</script>

examples/vue-code-file/.eslintrc.cjs

@@ -0,0 +1,37 @@
+module.exports = {
+  root: true,
+  // ❗️ It's very important that you don't have any rules configured at the top-level config,
+  // and to move all configurations into the overrides section. Since JavaScript rules
+  // can't run on GraphQL files and vice versa, if you have rules configured at the top level,
+  // they will try to also execute for all overrides, as ESLint's configs cascade
+  overrides: [
+    {
+      files: ['*.js', '*.vue'],
+      parser: 'vue-eslint-parser',
+      processor: '@graphql-eslint/graphql',
+      extends: ['eslint:recommended'],
+      env: {
+        es6: true,
+      },
+    },
+    {
+      files: ['*.graphql'],
+      parser: '@graphql-eslint/eslint-plugin',
+      plugins: ['@graphql-eslint'],
+      rules: {
+        '@graphql-eslint/no-anonymous-operations': 'error',
+        '@graphql-eslint/no-duplicate-fields': 'error',
+        '@graphql-eslint/naming-convention': [
+          'error',
+          {
+            OperationDefinition: {
+              style: 'PascalCase',
+              forbiddenPrefixes: ['Query', 'Mutation', 'Subscription', 'Get'],
+              forbiddenSuffixes: ['Query', 'Mutation', 'Subscription'],
+            },
+          },
+        ],
+      },
+    },
+  ],
+};

examples/vue-code-file/package.json

@@ -0,0 +1,18 @@
+{
+  "name": "@graphql-eslint/example-vue-code-file",
+  "version": "0.0.0",
+  "private": true,
+  "author": "Dimitri POSTOLOV",
+  "scripts": {
+    "lint": "eslint ."
+  },
+  "dependencies": {
+    "graphql": "16.6.0"
+  },
+  "devDependencies": {
+    "@graphql-eslint/eslint-plugin": "3.11.2",
+    "@vue/compiler-sfc": "3.2.40",
+    "eslint": "8.24.0",
+    "vue-eslint-parser": "9.1.0"
+  }
+}