graphiql 5: reduce bundle size, import prettier dynamically to avoid bundling Prettier

[dimaMachina]

we don't need prettier on initial loading, it's only used by clicking on format query button/shortcut

diff from vite example

-dist/assets/index-BMgFrxsd.js             4,911.53 kB │ gzip: 1,339.77 kB
+dist/assets/index-BlpzusGL.js             4,221.28 kB │ gzip: 1,145.58 kB

cc @benjie

[changeset-bot]

🦋 Changeset detected

Latest commit: ded6246

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 2 packages

Name	Type
@graphiql/react	Patch
graphiql	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions]

The latest changes of this PR are available as canary in npm (based on the declared changesets):

graphiql@5.0.6-canary-529e5971.0
@graphiql/plugin-code-exporter@5.0.1-canary-529e5971.0
@graphiql/plugin-doc-explorer@0.3.1-canary-529e5971.0
@graphiql/plugin-explorer@5.0.1-canary-529e5971.0
@graphiql/plugin-history@0.3.1-canary-529e5971.0
@graphiql/react@0.35.6-canary-529e5971.0

[benjie]

I'm not sure that GraphiQL itself should even embed prettier? Seems easy to add in a wrapper and something that people may or may not want (and may want to customize the options of).

Happy to see the bundle size reduced though!

[dimaMachina]

@benjie graphql‑js' print + parse strips GraphQL comments, Prettier preserves them, and Prettier can also format comments when you’re editing JSONC, which JSON.parse can’t handle.

Apollo Studio formats comments too, both in the operation and variables editors.

So, dynamically loading Prettier seems ok?

[benjie]

It's a pragmatic choice for now. Longer term I'd like to see an option in GraphQL to "retain comments". Maybe we already retain them, since we used to need to read comments in order to apply descriptions to things (before a comment syntax was added), so it could be as simple as just printing them - needs investigation.