ESLint parser, plugin and set rules for GraphQL (for schema and operations). Easily customizable with custom rules. Integrates with IDEs and modern GraphQL tools.
Please make sure the graphql-eslint version under package.json matches yours.
[ ] 2. A failing test has been provided
[ ] 3. A local solution has been provided
[ ] 4. A pull request is pending review
Describe the bug
I am trying to get graphql linting working using eslint flat config for my vue setup. This doesn't work: it tells me that I need to have @vue/compiler-sfc installed, but I do. I had linting working fine with eslintrc, so something about this change has triggered the problem. Probably the main thing is that eslintrc is CommonJS, while Flat Files use ESM (if the package is).
The underlying error, resulting in the compiler-sfc notice, is that graphql-tag-pluck uses require, even in its ESM version, which obviously won't work. That's actually only used when using the loadVueCompilerAsync, so actually the problem for graphql-eslint is that gqlPluckFromCodeStringSync is used for ESM. The non-sync version, gqlPluckFromCodeString, calls pluckVueFileCustomBlock > loadVueCompilerSync, which uses import instead. That should be used for the ESM version.
(Honestly the code in graphql-tag-pluck feels off to me, though my deep JS knowledge isn't fantastic. Odd to have the sync/async coupled to ESM/CJS, and I find the naming scheme both inconsistent and confusing. See also https://github.com/ardatan/graphql-tools/issues/3785)
To Reproduce Steps to reproduce the behavior:
There's no example of Vue & Flat Files running, maybe because of this? If someone converts the vue example in this dir into flat files, I'd be happy to modify it to repro. Though I suspect attempting that will run into the same problem, which is perhaps why it's not already done?
Issue workflow progress
Progress of the issue based on the Contributor Workflow
[ ] 1. The issue provides a reproduction available on GitHub, Stackblitz or CodeSandbox
[ ] 2. A failing test has been provided
[ ] 3. A local solution has been provided
[ ] 4. A pull request is pending review
Describe the bug
I am trying to get graphql linting working using eslint flat config for my vue setup. This doesn't work: it tells me that I need to have @vue/compiler-sfc installed, but I do. I had linting working fine with eslintrc, so something about this change has triggered the problem. Probably the main thing is that eslintrc is CommonJS, while Flat Files use ESM (if the package is).
The underlying error, resulting in the compiler-sfc notice, is that graphql-tag-pluck uses
require, even in its ESM version, which obviously won't work. That's actually only used when using theloadVueCompilerAsync, so actually the problem for graphql-eslint is thatgqlPluckFromCodeStringSyncis used for ESM. The non-sync version,gqlPluckFromCodeString, callspluckVueFileCustomBlock>loadVueCompilerSync, which uses import instead. That should be used for the ESM version.(Honestly the code in graphql-tag-pluck feels off to me, though my deep JS knowledge isn't fantastic. Odd to have the sync/async coupled to ESM/CJS, and I find the naming scheme both inconsistent and confusing. See also https://github.com/ardatan/graphql-tools/issues/3785)
To Reproduce Steps to reproduce the behavior:
There's no example of Vue & Flat Files running, maybe because of this? If someone converts the vue example in this dir into flat files, I'd be happy to modify it to repro. Though I suspect attempting that will run into the same problem, which is perhaps why it's not already done?
Expected behavior
Self-evident
Environment:
@graphql-eslint/eslint-plugin: latest