Using graphql-tag inside an Angular Component throws duplicated fragment/query error
See original GitHub issueDescribe the bug Here’s a bug repository: https://github.com/kroeder/angular-gql-gen-bug-repro-repo
If you use gql`...`
inside an angular component then gql-gen
fails with the message
> gql-gen
√ Parse configuration
> Generate outputs
> Generate src/__generated/types.ts
√ Load GraphQL schemas
√ Load GraphQL documents
× Generate
→ Found 2 errors in your documents
We found 1 errors
Failed to generate src/__generated/types.ts
Found 2 errors.
GraphQL Code Generator validated your GraphQL documents against the schema.
Please fix following errors and run codegen again:
./src/app/app.component.ts:
There can be only one fragment named "VoteFields".
./src/app/app.component.ts:
There can be only one fragment named "VoteFields".
This does not work
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
thisFragmentDoesNotWork = gql`
fragment VoteFields on Vote {
vote_value
}
`;
}
This does work
const outsideFragmentWorks = gql`
fragment VoteFields on Vote {
vote_value
}
`;
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
thisFragmentWorks = outsideFragmentWorks;
orThisOneAsWell = gql`
${outsideFragmentWorks}
`;
}
To Reproduce Steps to reproduce the behavior:
- Checkout https://github.com/kroeder/angular-gql-gen-bug-repro-repo
npm i
npm run gql-gen
- Play around with https://github.com/kroeder/angular-gql-gen-bug-repro-repo/blob/master/src/app/app.component.ts
Expected behavior
Should work. Altough I’m not sure if this is a gql-gen
or graphql-tag
issue
Schema/Documents Already inside the repo
Environment:
- OS: Windows 10
- Codegen:
"graphql-code-generator": "^0.14.5",
"graphql-codegen-typescript-client": "^0.14.5",
"graphql-codegen-typescript-common": "^0.14.5",
- Node:
$ node --version
v10.13.0
Issue Analytics
- State:
- Created 5 years ago
- Comments:5 (2 by maintainers)
Top Results From Across the Web
Fragments - Apollo GraphQL Docs
A GraphQL fragment is a piece of logic that can be shared between multiple queries and mutations. Here's the declaration of a NameParts...
Read more >Integrating GraphQL Code Generator in your frontend ...
In this article we'll try to explain and demonstrate common patterns for frontend development with GraphQL and GraphQL Code Generator.
Read more >The query is always of type unknown when created with ...
I'm Charly, from The Guild, working on GraphQL Code Generator. The preset: 'client' does not require to include fragments documents in the ...
Read more >GraphQL specification
Query variables can be used within fragments. Query variables have global scope with a given operation, so a variable used within a fragment...
Read more >apollostack - Bountysource
Declare fragments both in the .graphql file (for the query) and in the components (for props validation and data filtering) which is the...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@dotansimha I guess since v0.15.0 was released we can close this one
Works fine with
0.15.0-alpha.6d689c5d
Thanks!