codegen "typescript-react-apollo" plugin is redeclaring block-scope variables in generated output

Question

I've just started a new project that uses NextJS with graphql-codegen to generate my apollo-react types from my api. However, right off the bat it's creating duplicate exported variables and I can't build my project due to the typescript error. Any thoughts on how to prevent codegen from creating these duplicates?

codegen.ts

import type { CodegenConfig } from "@graphql-codegen/cli";

const config: CodegenConfig = {
  overwrite: true,
  documents: ["src/**/*.tsx"],
  schema: process.env.NEXT_PUBLIC_GRAPHQL_ENDPOINT,
  generates: {
    "./src/graphql/__generated__/": {
      preset: "client",
      plugins: ["typescript-react-apollo"],
    },
  },
};
export default config;

codegen error

// ./src/graphql/__generated__/
...
// creates two 'UserDocument' variables
export const UserDocument = {"kind":"Document","definitions":[{"kind":"OperationDefinition","operation":"query","name":{"kind":"Name","value":"User"},"variableDefinitions":[{"kind":"VariableDefinition","variable":{"kind":"Variable","name":{"kind":"Name","value":"userId"}},"type":{"kind":"NamedType","name":{"kind":"Name","value":"ObjectId"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"user"},"arguments":[{"kind":"Argument","name":{"kind":"Name","value":"id"},"value":{"kind":"Variable","name":{"kind":"Name","value":"userId"}}}],"selectionSet":{"kind":"SelectionSet","selections":[{"kind":"Field","name":{"kind":"Name","value":"id"}},{"kind":"Field","name":{"kind":"Name","value":"name"}},{"kind":"Field","name":{"kind":"Name","value":"email"}},{"kind":"Field","name":{"kind":"Name","value":"image"}},{"kind":"Field","name":{"kind":"Name","value":"hashedPassword"}},{"kind":"Field","name":{"kind":"Name","value":"role"}}]}}]}}]} as unknown as DocumentNode<UserQuery, UserQueryVariables>;

export const UserDocument = gql`
    query User($userId: ObjectId) {
  user(id: $userId) {
    id
    name
    email
    image
    hashedPassword
    role
  }
}
    `;
...

kevin · Accepted Answer · 2023-06-21 01:09:36Z

1

I ended up dumping the generates: { preset: 'client' } field and passed in all my own plugins and updated the configuration:

import type { CodegenConfig } from "@graphql-codegen/cli";

const config: CodegenConfig = {
  overwrite: true,
  documents: ["src/**/*.tsx"],
  schema: process.env.NEXT_PUBLIC_GRAPHQL_ENDPOINT,
  generates: {
    "./src/graphql/__generated__/graphql.ts": {
      plugins: [
        "typescript",
        "typescript-operations",
        "typescript-react-apollo",
      ],
    },
  },
};
export default config;

This seems to work.

answered Jun 21, 2023 at 1:09

kevin

3,5866 gold badges43 silver badges78 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

codegen "typescript-react-apollo" plugin is redeclaring block-scope variables in generated output

codegen.ts

codegen error

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

codegen.ts

codegen error

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related