Build throws warnings originating in `graphql-language-service-interface`

I have React app which depends on graphiql which we render on certain route (graphiql is not deployed as standalone app).

When executing:

npm run build

Several warnings are returned. Since our CI/CD treats warnings as errors, this is preventing us from building on CI/CD (unless we turn this off)

./node_modules/graphql-language-service-interface/dist/getOutline.d.ts 2:7
Module parse failed: Unexpected token (2:7)
You may need an appropriate loader to handle this file type.
| import { Outline } from 'graphql-language-service-types';
> export declare function getOutline(queryText: string): Outline | null | undefined;
| //# sourceMappingURL=getOutline.d.ts.map

./node_modules/graphql-language-service-interface/dist/getDefinition.d.ts 3:7
Module parse failed: Unexpected token (3:7)
You may need an appropriate loader to handle this file type.
| import { FragmentSpreadNode, FragmentDefinitionNode, OperationDefinitionNode, NamedTypeNode } from 'graphql';
| import { DefinitionQueryResult, FragmentInfo, Uri, ObjectTypeInfo } from 'graphql-language-service-types';
> export declare const LANGUAGE = "GraphQL";
| export declare function getDefinitionQueryResultForNamedType(text: string, node: NamedTypeNode, dependencies: Array<ObjectTypeInfo>): Promise<DefinitionQueryResult>;
| export declare function getDefinitionQueryResultForFragmentSpread(text: string, fragment: FragmentSpreadNode, dependencies: Array<FragmentInfo>): Promise<DefinitionQueryResult>;

./node_modules/graphql-language-service-interface/dist/autocompleteUtils.d.ts 3:7
Module parse failed: Unexpected token (3:7)
You may need an appropriate loader to handle this file type.
| import { GraphQLField, GraphQLSchema, GraphQLType } from 'graphql';
| import { CompletionItem, ContextToken, State, AllTypeInfo } from 'graphql-language-service-types';
> export declare function getDefinitionState(tokenState: State): State | null | undefined;
| export declare function getFieldDef(schema: GraphQLSchema, type: GraphQLType, fieldName: string): GraphQLField<any, any> | null | undefined;
| export declare function forEachState(stack: State, fn: (state: State) => AllTypeInfo | null | void): void;

./node_modules/graphql-language-service-interface/dist/getAutocompleteSuggestions.d.ts 3:7
Module parse failed: Unexpected token (3:7)
You may need an appropriate loader to handle this file type.
| import { GraphQLSchema } from 'graphql';
| import { CompletionItem, ContextToken, State, AllTypeInfo, Position } from 'graphql-language-service-types';
> export declare function getAutocompleteSuggestions(schema: GraphQLSchema, queryText: string, cursor: Position, contextToken?: ContextToken): Array<CompletionItem>;
| export declare function getTokenAtPosition(queryText: string, cursor: Position): ContextToken;
| export declare function getTypeInfo(schema: GraphQLSchema, tokenState: State): AllTypeInfo;

./node_modules/graphql-language-service-interface/dist/GraphQLLanguageService.d.ts 4:7
Module parse failed: Unexpected token (4:7)
You may need an appropriate loader to handle this file type.
| import { CompletionItem, DefinitionQueryResult, Diagnostic, GraphQLCache, GraphQLConfig, GraphQLProjectConfig, Uri, Position } from 'graphql-language-service-types';
| import { Hover } from 'vscode-languageserver-types';
> export declare class GraphQLLanguageService {
|     _graphQLCache: GraphQLCache;
|     _graphQLConfig: GraphQLConfig;

./node_modules/graphql-language-service-interface/dist/getHoverInformation.d.ts 4:7
Module parse failed: Unexpected token (4:7)
You may need an appropriate loader to handle this file type.
| import { ContextToken, Position } from 'graphql-language-service-types';
| import { Hover } from 'vscode-languageserver-types';
> export declare function getHoverInformation(schema: GraphQLSchema, queryText: string, cursor: Position, contextToken?: ContextToken): Hover['contents'];
| //# sourceMappingURL=getHoverInformation.d.ts.map

./node_modules/graphql-language-service-interface/dist/getDiagnostics.d.ts 4:7
Module parse failed: Unexpected token (4:7)
You may need an appropriate loader to handle this file type.
| import { Diagnostic, CustomValidationRule } from 'graphql-language-service-types';
| import { Range } from 'graphql-language-service-utils';
> export declare const SEVERITY: {
|     ERROR: number;
|     WARNING: number;

Toolset versions:

• node: v10.16.3
• npm: 6.9.0
• tcs: 3.7.2

I’m not sure whether this is the same issue as #882, I saw webpack being used by react build script, but errors are different.

[acao]

We have a webpack example we will be merging in the next week, until we make this fix it wont work with create react app without overriding the webpack config. but it should work fine with CRA once we merge that dynamic file resolution bugfix for webpack. Been talking with a webpack maintainer about it, very tricky!

On Wed, Nov 13, 2019 at 1:07 PM Zdenek Havlin [e-mail] wrote:

@acao https://github.com/acao I don’t import anything myself, this seems to be done somewhere within react build scripts.

I did only:

• npm install graphiql (this brought dependency on graphql-language-service-interface)
• `import GraphiQL from ‘graphiql’
• import …css
• <GraphiQL …/>

nothing more.

— You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub https://github.com/graphql/graphiql/issues/996?email_source=notifications&email_token=AAKOFF5JUMMK5Y6IXS4SPLDQTQ65VA5CNFSM4JMZDJZ2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOED7DE7Y#issuecomment-553529983, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAKOFF4LRGLRF3HZRADOYWDQTQ65VANCNFSM4JMZDJZQ .

[robbertkl]

I’m using GraphiQL in the exact same way as @wdolek and was experiencing the same warnings.

I’ve just updated to GraphiQL 0.17.0 and can confirm the warnings are gone!