dotansimha / dotansimha/graphql-code-generator-community
How to use both near-operation-file-preset and import-types-preset with typescript and react
- Dominant language
- TypeScript
- Stars
- 137
- Forks
- 195
- Avg merge
- 6h 20m
- Merged PRs (30d)
- 16
Description
I want to generate typing declear once in single file and other files just import its type from it when i start working with `react`,`typescript` and `graphql`
Although `near-operation-file-preset` `generates a file per each operation file`,every file repeats typing declear. And `import-types-preset ` helps import types from file but it can not generate files like `near-operation-file-preset` .
One more thing is that `near-operation-file-preset` contains both types and components ,while splited to single file may be better i think.
What I want may look like this:
```js
graphql
|--test1.graphql // query and mutations
|--test1.generated.tsx // components and hooks without types
|--test2.graphql
|--test2.generated.tsx
|--types.ts // types
```
But I find it's hard to work with both.
```yaml
overwrite: true
schema: './schema.graphql'
documents: 'src/**/*.graphql'
generates:
src/graphql/types.tsx:
- typescript
src/graphql/:
preset:
# near-operation-file
import-types
presetConfig:
# extension: .generated.tsx
# baseTypesPath: types.ts
typesPath: types.ts
plugins:
- time:
format: DD.MM.YY
message: 'The file generated in: '
- typescript
- typescript-operations
- typescript-react-apollo
config:
withHOC: true
withHooks: true
skipTypename: true
```
Does anyone can help me ?
Thanks a lot!
Contributor guide
No contributing guide indexed for this repository
Research direction
The issue names the near-operation-file and import-types presets and shows a GraphQL Code Generator YAML configuration, but no repository files or tests. Start by reading the documentation and preset entry points for both presets, then check whether the requested separate types.ts and per-operation generated files are supported together. Done means a documented configuration or a clearly documented limitation.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- graphql, react, typescript
- Domain
- tooling
- Issue type
- Feature
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100