How to setup grapql(t3 stack) with typeschecking?

I want to use the @apollo/server and @apollo/client

7 Replies

I would say just set it up like you normally would in nextjs https://www.apollographql.com/docs/apollo-server/integrations/integration-index https://www.npmjs.com/package/@as-integrations/next

Apollo Docs

Apollo Server Integrations

npm

@as-integrations/next

An Apollo Server integration for use with Next.js. Latest version: 1.2.0, last published: 3 months ago. Start using @as-integrations/next in your project by running npm i @as-integrations/next. There is 1 other project in the npm registry using @as-integrations/next.

midOP•2y ago

I had looked at this

cje•2y ago

"t3 stack with graphql" is just nextjs

midOP•2y ago

How i have setup my apollo server src/server/apollo/client.tsx

import { ApolloServer } from '@apollo/server';
import { typeDefs } from './typeDefs';
import { resolvers } from './resolvers';
import { env } from "../../env/server.mjs";
import {
  ApolloServerPluginLandingPageLocalDefault,
  ApolloServerPluginLandingPageProductionDefault,
} from '@apollo/server/plugin/landingPage/default';





declare global {
  // eslint-disable-next-line no-var
  var apollo: ApolloServer | undefined;
}

export const apollo = global.apollo || new ApolloServer({
  typeDefs,
  resolvers,
  nodeEnv: env.NODE_ENV,
  introspection: env.NODE_ENV !== "production",
  plugins: [
    process.env.NODE_ENV === 'production'
      ? ApolloServerPluginLandingPageProductionDefault()
      : ApolloServerPluginLandingPageLocalDefault({ embed: false }),
  ],
});


if (env.NODE_ENV !== "production") {
  global.apollo = apollo;
}

import { ApolloServer } from '@apollo/server';
import { typeDefs } from './typeDefs';
import { resolvers } from './resolvers';
import { env } from "../../env/server.mjs";
import {
  ApolloServerPluginLandingPageLocalDefault,
  ApolloServerPluginLandingPageProductionDefault,
} from '@apollo/server/plugin/landingPage/default';





declare global {
  // eslint-disable-next-line no-var
  var apollo: ApolloServer | undefined;
}

export const apollo = global.apollo || new ApolloServer({
  typeDefs,
  resolvers,
  nodeEnv: env.NODE_ENV,
  introspection: env.NODE_ENV !== "production",
  plugins: [
    process.env.NODE_ENV === 'production'
      ? ApolloServerPluginLandingPageProductionDefault()
      : ApolloServerPluginLandingPageLocalDefault({ embed: false }),
  ],
});


if (env.NODE_ENV !== "production") {
  global.apollo = apollo;
}

Is there a way to get static type checking for typeDefs and resolvers?

midOP•2y ago

Currently i have to open this and enter the gql and copy and paste into my client

midOP•2y ago

midOP•2y ago

@cje @erik.gh It it because we can add and remove fields from therefore this method is not a good idea?

Gaming

Programming

How to setup grapql(t3 stack) with typeschecking?