jss icon indicating copy to clipboard operation
jss copied to clipboard

[templates/nextjs] [templates/nextjs-styleguide] Remove graphql-let and rely directly on graphql-codegen for graphql code generation

Open yavorsk opened this issue 1 year ago • 1 comments

Description / Motivation

This pull request removes graphql-let as a dependency and makes necessary changes so that we use directly graphql-codegen for graphql code generation. (based on https://github.com/Sitecore/jss/commit/fa37c606159b1cc596219c7552cc21541c757c78) Reason for these changes being a./ graphql-let is not actively maintained and contains several critical security vulnerabilities and b./ it causes (or at least worsens) the problem with out of memory error during code generation. Changes include:

  • removes graphql-let from dependencies;
  • upgrades all graphql-codegen packages to latest;
  • adds the necessary graphql-codegen configuration and update to package json scripts;

Several notes:

  • graphql-codegen does not create .d.ts files as graphql-let does. Instead queries should be imported from the main generated file so this is a breaking change;
  • graphql-codegen throws an error if configuration is set search for .graphql files but it does not find them in the specified path; this is why the 'documents' setting in the nextjs sample should be commented out and additional config file is added for nextjs-stylguide template;

Testing Details

  • [ ] Unit Test Added
  • [x] Manual Test/Other (Please elaborate) - test graphql code generation - by adding new fields templates in sitecore; by adding graphql queries;

Types of changes

  • [ ] Bug fix (non-breaking change which fixes an issue)
  • [ ] New feature (non-breaking change which adds functionality)
  • [x] Breaking change (fix or feature that would cause existing functionality to change)

yavorsk avatar Jan 15 '24 12:01 yavorsk

@yavorsk I noticed a recommendation added by graphql-codegen to use client-preset package to reduce a bundle size and improve dev experience: https://the-guild.dev/graphql/codegen/plugins/typescript/typescript-react-query Did you explore this option? It should be possible to use in React/Vue based projects. So, it makes sense for us

illiakovalenko avatar Jan 17 '24 07:01 illiakovalenko