Update: Included ARTICLES_QUERY
, tsconfig.json
, and package.json
as requested.
Update 2: The current solution is functional, but it doesn't seem ideal. Any suggestions for improvement would be appreciated.
export default class InterfaceGraphQLApi extends GraphQLDataSource {
baseURL = "http://localhost:4545/admin/api";
query = super.query;
Update 3: @Max's solution resolves the issue with the query field, but it causes TypeScript to fail compiling due to another 'error': https://i.sstatic.net/xOK8p.png
ARTICLE_QUERY
snippet below:
const ARTICLE_QUERY = gql`
query Article($id: ID!) {
Article(where: { id: $id }) {
title
text
video {
youtube {
... on OEmbedVideo {
html
type
}
}
}
podcast {
spotify {
... on OEmbedRich {
html
type
}
}
}
images {
file {
filename
}
}
}
}
`;
Update 4: The modified version of Max's solution is functioning correctly.
I'm fairly new to TypeScript. I'm using an npm library to set up a GraphQL data source for my Apollo Server project. I'm extending the class provided by this library in my project.
import { GraphQLDataSource } from "apollo-datasource-graphql";
import { gql } from "apollo-server";
const ARTICLES_QUERY = gql`
query {
allArticles {
title
text
id
status
images {
file {
filename
}
}
}
}
`;
export default class InterfaceGraphQLApi extends GraphQLDataSource {
baseURL = "http://localhost:4545/admin/api";
async getArticles() {
try {
const response = await this.query(ARTICLES_QUERY);
However, TypeScript is giving an error for this.query
, stating
https://i.sstatic.net/WEWEg.png
The query
method is inherited from the imported library's class. How can I resolve this to make TypeScript happy?
Here is tsconfig.json:
{
"compilerOptions": {
"target": "ESNext",
"lib": [
"esnext",
"dom"
],
"skipLibCheck": true,
"outDir": "dist",
"strict": false,
"forceConsistentCasingInFileNames": true,
"esModuleInterop": true,
"module": "commonjs",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"sourceMap": true
},
"exclude": [
"node_modules"
]
}
And here is package.json:
{
"dependencies": {
"apollo-datasource-graphql": "^1.3.2",
"apollo-server": "^2.10.1",
"graphql": "^14.6.0"
},
"devDependencies": {
"babel-eslint": "^10.0.3",
"eslint": "^6.8.0",
"eslint-config-airbnb-base": "^14.0.0",
"eslint-config-prettier": "^6.10.0",
"eslint-plugin-prettier": "^3.1.2",
"pino": "^5.16.0",
"prettier": "^1.19.1",
"ramda": "^0.26.1",
"typescript": "^3.8.3"
},
"scripts": {
"dev": "tsc && node dist/index.js"
}
}
Additionally, I am seeking guidance on the necessary type definitions for Apollo Server and GraphQL -- When searching for 'Apollo Server type definitions,' I found this resource, which has several dependencies that need to be downloaded individually. Is there something like @types/apollo-server
? (When running yarn @types/apollo-server
, I received
https://registry.yarnpkg.com/@types%2fapollo-server: Not found.
)
Any assistance would be greatly appreciated!