CODEWITHSUNDEEP
graphqlgraphql-codegen
user8758206
user8758206

Reputation: 2191

Codegen generates graphql schema with import in incorrect place

I am using the graphql code generator tool to generate graphql types and hooks, and for some reason it generates a schema.ts file where the following import is placed all the way down on line 197 rather than at the top:

import { IntrospectionQuery } from 'graphql';

Thus react obviously complains with:

src/graphql/generated/schema.ts
  Line 197:1:  Import in body of module; reorder to top  import/first

Here is the part of the schema.ts file:

…

export type SendEmMutation = { __typename?: 'Mutation', sendPasswordResetEmail: { __typename?: 'SuccessResponse', success: boolean } };

import { IntrospectionQuery } from 'graphql';
export default {
  "__schema": {
    "queryType": {
      "name": "Query"
    },
    "mutationType": {

…

The codegen.yml file:

overwrite: true
schema: ${GRAPHQL_ENDPOINT}
documents: '**/*.{gql,graphql}'
generates:
    src/graphql/generated/schema.ts:
        plugins:
            - 'typescript'
            - 'typescript-operations'
            - 'urql-introspection'
            - 'typescript-urql'
        config:
            withHooks: true
    ./graphql.schema.json:
        plugins:
            - 'introspection'

Package.json

"devDependencies": {
    "@graphql-codegen/cli": "2.11.8",
    "@graphql-codegen/introspection": "2.2.1",
    "@graphql-codegen/typescript": "2.7.3",
    "@graphql-codegen/typescript-operations": "2.5.3",
    "@graphql-codegen/typescript-urql": "^3.6.4",
    "@graphql-codegen/urql-introspection": "2.2.1",

The script npm run codegen generates the file by running this (in scripts in package.json) "graphql-codegen --require dotenv/config"

I can of course just manually remove the import from line 197 and place it at the top; but why is it adding the import around line 197? I'd rather not have to manually do this every time I run the npm run codegen script. Any help would be appreciated, thanks.

Note that I am using URQL client at the front-end and Apollo Server at the back-end.

Upvotes: 0

Views: 1127

Answers (1)

Charly Poly
Charly Poly

Reputation: 494

I'm Charly, from The Guild, working on GraphQL Code Generator.

You are right; the output of the urql-introspection plugin could be considered as invalid for some linters.

However, please know that we recommend not committing and excluding from code formatters (ex: Prettier) and linters all the files generated by codegen.

Upvotes: 1

Related Questions