Unable to find any GraphQL type definitions for the following pointers: src/**/*.graphql

Question

I am using the @graphql-codegen/cli tool to generate typescript types out of my graphql server. Here is my codegen.yml content:

overwrite: true
schema: "http://localhost:3001/graphql"
documents: "src/**/*.graphql"
generates:
  src/generated/graphql.tsx:
    plugins:
      - "typescript"
      - "typescript-operations"
      - "typescript-react-apollo"
  ./graphql.schema.json:
    plugins:
      - "introspection"

Here is the package.json script I use to generate my types (yarn schema):

"schema": "graphql-codegen --config codegen.yml"

All these have been automatically generated by executing the cli wizard yarn codegen init.

But when I run yarn schema, these are the errors I get:

(server is positively running at http://localhost:3001/graphql and exposes the graph schema.

Thanks for your help and suggestion

Here is the .graphql file hosted in my server (http://localhost:3001/graphql

# -----------------------------------------------
# !!! THIS FILE WAS GENERATED BY TYPE-GRAPHQL !!!
# !!!   DO NOT MODIFY THIS FILE BY YOURSELF   !!!
# -----------------------------------------------

"""Date custom scalar type"""
scalar Date

type Mutation {
  create_user(user: UserInput!): User!
  create_pofficer(pofficer: POfficerCreateInput!): POfficer!
  create_incident(incident: TIncidentInput!): TIncident!
  add_incident_type(incident_type: TIncidentTypeInput!): TIncidentType!
}

type POfficer {
  _id: ID!
  userid: ID!
  user: User!
}

input POfficerCreateInput {
  name: String!
  surname: String!
  phone: String!
}

type Query {
  users: [User!]!
  pofficers: [POfficer!]!
  incidents: [TIncident!]!
  incident_types: [TIncidentType!]!
}

type TIncident {
  _id: ID!
  createdAt: Date!
  incidenttype_id: ID!
  pofficer_id: ID!
  toffender_id: ID
  toffender_phone: String!
  carnumber: String!
  incident_status: String!
  pofficer: POfficer!
  toffender: User!
  incident_type: TIncidentType!
}

input TIncidentInput {
  incidenttype_id: ID!
  pofficer_id: ID!
  toffender_phone: String!
  carnumber: String!
}

type TIncidentType {
  _id: ID!
  name: String!
  description: String
}

input TIncidentTypeInput {
  name: String!
  description: String
}

type User {
  _id: ID!
  name: String!
  surname: String!
  email: String
  phone: String!
}

input UserInput {
  name: String!
  surname: String!
  email: String!
  phone: String!
}

Answer 1

The file your shared is your schema (as generated by your server), but it seems that you haven't created any queries or mutations on top of it. This would be a reason why the codegen is not working properly.

I suggest thay you create a new file with a simple query, such as: get-users.query.graphql

query GetUsers {
  user {
    _id
    __typename
    name
    surname
    email
    phone
  }
}

And add it to your src folder (since your codegen is configured to find all .graphql files inside your src folder). Then re-run the codegen and see if it works well.

Aftewards you can generated all kinds of .graphql files with your queries and mutations and use the codegen to generate the corresponding types.

Answer 2

In my case I refactored all my queries into a single file in a new folder: lib/queries.tsx.

What I needed to do then is add that filepath to codegen.yml:

documents:
  - "./lib/queries.tsx"

Answer 3

please check the suffix of your operation files and change this file based on that, maybe your file suffix is .ts or .js and by default in codegen.yml document is

documents: "src/**/*.graphql"    

replace the .graphql to the suffix of your operation file name like .ts or .js

That was my problem, or maybe the documents address is wrong

Answer 4

In some cases, this error could be the result of having spaces in the absolute path of your project. e.g.: /home/my project folder with spaces/node_modules/*

Answer 5

Specificity in the 'documents' codegen.yml file

You must be careful in the documents field, because when you init graphql-code, the default value is the one provided in the example (src/**/*.graphql), but this is considering a React app in most cases.

However, in my case I use Next and there is no src directory (although create-next-app gives you the option to have a src dir). So, I need to specify where those files with the extension .graphql are going to be exactly.

Why .graphql files are needed

In other news, the .graphql file or files are necessary because we are telling codegen what data we want to request and therefore, the codegen is supposed to generate the types for us.

As you know, you may require all the data in the graphql API or just a part of it. In any case, codegen is going to get only the types of the data you are requesting.

If you do not create any .graphql file, codegen is not going to produce any types for you, since it does not know what it's looking for.