jss
jss copied to clipboard
[templates/nextjs] [templates/nextjs-styleguide] Remove graphql-let and rely directly on graphql-codegen for graphql code generation
- [x] This PR follows the Contribution Guide
- [x] Changelog updated
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 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