https://www.prisma.io/ logo
Join Slack
Powered by
Hi, I just started a project with advanced typescr...
# orm-help
k
Hi, I just started a project with advanced typescript-graphql-server boilerplate and wanted to use 
graphqlgen
as well but don’t know how to configure it properly. Is there a guide on how to pair it both together?
m
hi @k0ff33 you can look at:

https://www.youtube.com/watch?v=6ZSF60zVFow▾

this will give you some info how to start with this tool 🙂
k
Hey @mpacholec, I’ve watched it already, just fail to understand how to match it with prisma and 
graphql codegen
properly. The examples are just for a yoga server standalone.
m
do you have source code on github ?
or somewhere with public access ?
k
I literally used the advanced typescript-graphql-server boilerplate https://github.com/graphql-boilerplates/typescript-graphql-server/tree/master/advanced
m
ok 🙂
so what is the problem exactly
?
do you have some error message ? 🙂
k
Setup. 
graphqlgen
requires to pass a context in the 
graphqlgen.yml
which is defined as a function in the boilerplate: https://github.com/graphql-boilerplates/typescript-graphql-server/blob/master/advanced/src/index.ts#L8
I’m double checking if that’s the actual problem I had before
m
you don't need to specify context, it's optional
but context in config means
that it's some kind of interface in *.ts file
eg.
Copy code
export interface Context {
    myDataSource: RESTDataSource; 
headers: string[];
}
sth like that
if you have file which holds all of your 
model
in typescript
and you specify
k
I do, it’s auto generated through 
graphql codegen
Without specifying 
context
prop at all, I get 
Error occurred while reading schema: Error: Field feed: Couldn't find type Post in any of the schemas.
m
so what is your config file looks like?
ok
hmm
it's difficult to say sth without looking at the code
😕
but I have an idea 😛
leave context prop as it was before
k
I know, but it’s a private repo unfortunately 😞. It literally has been created today with the boilerplate I mentioned above and the only modified thing is the actual 
datamodel.graphql
m
can you send snippet containing 
graphqlgen.yml
?
k
Try with 
graphql create my-app --boilerplate typescript-advanced
, it will create the same structure as I’m using atm
m
ok 😛 👍
sec
k
m
ok cool but I meant 
graphqlgen.yml
Copy code
language: typescript

schema: ./src/schema.graphql
context: ./src/types.ts:Context
models:
  files:
    - ./src/generated/prisma-client/index.ts

output: ./src/generated/graphqlgen.ts

resolver-scaffolding:
  output: ./src/generated/tmp-resolvers/
  layout: file-per-type
do you have similar ?
k
Ah, sorry!
Copy code
language: typescript

schema: ./src/schema.graphql
# context: ./src/index.ts
models:
  files:
    - ./src/generated/prisma.ts

output: ./src/generated/graphqlgen.ts

resolver-scaffolding:
  output: ./src/generated/tmp-resolvers/
  layout: file-per-type
m
👍
I see problem
do you have Context type in index.ts ?
k
Yeah, I’ve checked it.
context: Points to the definition of the context object that’s passed through your GraphQL resolver chain.
It’s not clear to me with my setup
That boilerplate doesn’t define a Context interface
m
ok so create one in index.ts
k
Do I need to define it myself then?
m
e.g.
Copy code
export interface Context {
someField: any;
}
in index.ts
this interface need to describe your actual context object
and then
in graphqlgen.yml
context: ./src/index.ts:Context
thats it
it means that graphqlgen will try to locate Context interface in index.ts file
k
Right, the setup makes sense, I just probably don’t fully understand what a context object in my yoga+prisma server is
With
Copy code
export interface Context {
  data: any
}
it complains: 
Error occurred while reading schema: Error: Field feed: Couldn't find type Post in any of the schemas.
So I probably still need to define it and import the interfaces
m
it's sth different
this error tells that theres no Post type
or it cannot find one
k
Oh, true, I’ve removed it from the boilerplate
Good catch
m
🙂
about context
k
So how does it differ when I define the 
Context
interface with 
data: any
rather than providing an actual Data interface?
Copy code
export interface Context {
  data: any
}

// vs

export interface Context {
  data: Data
}

export interface User {
  id: string
  name: string | null
  postIDs: string[]
}

export interface Post {
  id: string
  title: string
  content: string
  published: boolean
  authorId: string
}

export interface Data {
  posts: Post[]
  users: User[]
  idProvider: () => string
}
m
well provide actual fields
i wrote 
data: any
just for example
as i cannot see source code 😛
k
I know, I’m just trying to understand how does 
Context
interface fit in
m
wait
look at this
Copy code
context: req => ({
    ...req,
    db: new Prisma({
      endpoint: process.env.PRISMA_ENDPOINT, // the endpoint of the Prisma API (value set in `.env`)
      debug: true, // log all GraphQL queries & mutations sent to the Prisma API
      // secret: process.env.PRISMA_SECRET, // only needed if specified in `database/prisma.yml` (value set in `.env`)
    }),
}),
ehh
sec
k
yeah 😄
m
this is thing taken straight from github example
so
Context 
type
in this situation
k
is 
ContextParameters && Prisma
?
m
Copy code
export interface Context {
    [header: string]: string;
    db: Prisma;
}
i dont know how 
req
will be speaded
yup basically you're right 🙂
k
So more like:
Copy code
import { Prisma } from './generated/prisma'
import { ContextParameters } from 'graphql-yoga/dist/types'

export interface Context extends ContextParameters {
  db: Prisma
}
That 
ContextParameters
import was auto completed from vscode 🤷
m
look at this one
this are typings for graphql-yoga
and you're using that pkg right ?
k
yeah, setup comes in 100% from the boilerplate as I mentioned
m
ContextParameters are not needed here
k
I’ve read it’s the recommended way of starting new typescript yoga+prisma servers
m
prev link was not the thing I wanted to send 😛
export type Context = { [key: string]: any }
type definition for context in their package
so
Copy code
export interface Context {
    [key: string]: any;
    db: Prisma;
}
k
Ok, cool thanks!
m
should be more appropriate
🙂
just tell me if it works 🙂
oh and name this 
Context
interface more specific
like 
MyVeryCoolContext
😛
not to collide with types from deps you're using 🙂
k
Cool, that works perfectly! Thanks a lot @mpacholec for your help!
m
no problem happy to help 🙂
k
I got confused before because I didn’t know exactly what’s in the 
Context
interface
m
cheers 😄
k
I’m still new to the topic 🙂
Cheers!
@mpacholec I’ve actually realised that the boilerplate defines the 
Context
interface in `utils.ts`: https://github.com/graphql-boilerplates/typescript-graphql-server/blob/master/advanced/src/utils.ts#L4
With:
Copy code
export interface Context {
  db: Prisma
  request: any
}
As simple as that 😄
I have no idea how could I miss that before, thanks again for your help
m
well, I think that 
request: any
shouldn't be there
because of fn 
context: (request) => ({})
and it's returning context object
🙂
2 Views
Open in Slack
PreviousNext
Powered by