Mistakes from the @graphql-eslint/eslint-plugin

We are currently working on developing micro-services using NestJS with TypeScript, where each service exposes a GraphQL schema. To combine these schemas into a single graph, we have implemented a federation service within NestJS.

During the integration process with '@graphql-eslint/eslint-plugin', I encountered some unexpected exceptions:

The error message "Unknown directive "@key"" was being thrown.

Fortunately, I was able to resolve these errors by following a discussion on GitHub: https://github.com/cjoudrey/graphql-schema-linter/issues/210

I then created a new file containing type specifications based on the Apollo documentation guidelines: https://www.apollographql.com/docs/federation/federation-spec/#federation-schema-specification

Despite resolving the initial issue, I am now facing additional errors that I am unfamiliar with and unsure how to address:

The parsing error states: "Cannot extend type "Query" because it is not defined. Did you mean "User"?".

It also mentions: "Cannot extend type "Mutation" because it is not defined."

Additionally, there are errors indicating: "Unknown type "Query". Did you mean "User"?", and "Unknown type "Mutation".".

Sharing a snippet of my schema for reference:

extend type Query {
  users: [User]
  user(email: EmailAddress!): User
}

extend type Mutation {
  createUser(userData: UserData!): User
}

type User @key(fields: "email") {
  email: String!
  name: String
}

input UserData {
  email: String!
  name: String
}

If anyone has insights on why these errors are occurring or how to resolve them, your input would be greatly appreciated.

Answer №1

The error message indicates that the terms "Query" and "Mutation" have not been declared.

To resolve this issue, these terms need to be explicitly defined before they can be extended. Here is an example of how this can be done:

type Query {
  _empty: String
}

type Mutation {
  _empty: String
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Leveraging Nextjs Link alongside MUI Link or MUI Button within a different functional component (varieties)

Currently in my development setup, I am utilizing Next.js (10.2) and Material-UI (MUI) with Typescript. In the process, I have implemented a custom Link component: Link.tsx (/components) [...] On top of that, I have created another iteration which functi ...

Trouble encountered with Axios post request in TypeScript

Currently, I am in the process of integrating TypeScript into my project and while working with Axios for a post request, I encountered an issue. The scenario is that I need to send email, first name, last name, and password in my post request, and expect ...

The saved editable input number is automatically pushed even without needing to click on save or cancel

I am working with a datatable, chart, and a label that shows the latest added value. The table and chart display time-series data for the last 30 minutes, including the timestamp and a random numerical value between 0 and 999. Every 10 seconds, a new data ...

Tips on showcasing an array as a matrix with a neat line property

I am currently developing an application using TypeScript, and utilizing a JSON array structured like this: data = [{"name":"dog", "line":1}, {"name":"cet", "line":1}, ...

Separating HTML content and text from a JSON response for versatile use within various sections of an Angular 2 application using Typescript

Hello there! I am currently utilizing Angular 2 on the frontend with a WordPress REST API backend. I'm receiving a JSON response from the service, however, the WP rest API sends the content with HTML tags and images embedded. I'm having trouble s ...

Uploading images using multipart in react is causing an error and cannot be completed

Trying to upload images in the database using multipart is causing an error from the API saying 'Files can't be uploaded". Checking the API in postman shows it is working fine there. There seems to be an issue with my code, but I can't ...

Error encountered after deploying Angular 4 application with Webpack 3 in a production environment

Upon successfully building with angular4+webpack3, I encountered an error on the second refresh in the browser. The error message was: uncaught exception: reflect-metadata shim is required when using class decorators To resolve this issue, I had to add ...

Having an issue in Angular 2 where the correct function is not triggered when a button is placed within a selectable anchor

Within an anchor element, I have a button that triggers its own click listener for an editing popup module. The anchor itself has another click listener assigned to it. For example: <a (click)="onClick(myId)" class="list-group-item clearfix"> < ...

Replace FormControl.disabled by using a CSS or HTML attribute

I have a customized angular date picker where I want to restrict user input by disabling the input field and only allowing selection from the date picker. However, using the "disabled" attribute on the input element is not an option due to conflicts with t ...

Tips for sorting multiple rows based on the primary column in MUI DataGrid ReactJS

https://i.stack.imgur.com/T9ODr.png Is there a way to utilize Material UI DataGrid to build a table that matches the structure displayed in the linked image? I have successfully created a basic table with DataGrid, but I'm struggling to add multiple ...

What could be the reason for encountering TypeScript within the Vue.js source code?

While exploring the vue.js source code, I stumbled upon some unfamiliar syntax that turned out to be TypeScript after further investigation. What baffled me was finding this TypeScript syntax within a ".js" file, when my understanding is that TypeScript ...

What is preventing a mapped type from completely resolving a lookup with a generic yet finite key?

Let's break down the issue at hand: type Animal = 'dog' | 'cat'; type AnimalSound<T extends Animal> = T extends 'dog' ? 'woof' : T extends 'cat' ? 'meow' : never; cons ...

Is it possible for me to choose a specific reducer to dispatch to in ngrx?

Just started exploring Redux and curious about the best way to implement multiple reducers. Specifically, I'm interested in how to direct actions to a specific reducer. For example, if I have two reducers: one for users and one for posts. User Reduc ...

Angular 13 - Encountering issue with "Cannot access properties of null (reading 'getParsed')"

Currently working on a new Angular 13 project and running into an error: TypeError: Unable to access properties of null (reading 'getParsed') at .../main.2506c840be361c93.js:1:325924 at Array.filter () at nd._getActiveElements (.../main.2506c84 ...

Enhance the functionality of a module by incorporating plugins when Typescript definitions are divided into multiple files

During my exploration of Typescript 2.2, I encountered a challenge in defining a module for HapiJS with various plugin options. To streamline the core code, I split it into multiple .d.ts files and then imported and re-exported them all from the index.d.t ...

What are some different options for supplying in Angular 2?

In the past, I utilized provide from @angular/core. For example: import {provide} from '@angular/core'; import {ToastOptions} from "ng2-toastr/ng2-toastr"; let options = { positionClass: 'toast-bottom-right', }; //then used inside ...

Error: The function parentSubmit does not exist

Hello, I am currently in the process of converting a redux-forms TypeScript class component into hooks. Here is the original class-based component that will eventually be converted to hooks: import React from 'react'; import { connect } from &ap ...

Including files in node package without specifying the name of the dist directory

In my library directory structure for seamless import by node js projects, it looks like this: my-lib/ ├─ dist/ │ ├─ index.js │ ├─ foo.js ├─ src/ │ ├─ index.ts │ ├─ foo.ts ├─ package.json Take a look at my package.j ...

implementing GraphQL lists in mutations using Apollo in a React JS application

My current situation involves a mutation that looks like this: orderAdd(products: [ProductInput],restaurant: RestaurantInput) implemented in graphql, and now I want to pass parameters to it using Apollo in react js as shown below: mutation orderAdd ($ ...

Tips for evaluating the stickiness of a block within a cell when it adheres to a mat-header-cell

I am working with an Angular table and facing an issue. How can I make the span element in the cells of the first column stick to the sticky mat-header-row when scrolling down the table? My requirement is for the span element to stay attached to the lower ...