dotansimha / graphql-yoga

🧘 Rewrite of a fully-featured GraphQL Server with focus on easy setup, performance & great developer experience. The core of Yoga implements WHATWG Fetch API and can run/deploy on any JS environment.
https://the-guild.dev/graphql/yoga-server
MIT License
8.14k stars 562 forks source link

docs(Getting started): Suggest code snippets that work without changes #3283

Open TPXP opened 2 months ago

TPXP commented 2 months ago

The "Quick start" page of the docs is confusing when starting a project from scratch. I was trying to experiment quickly with Yoga so I started a new project, installed graphql-yoga and graphql and created schema.js and index.js with the code from the snippets on the page.

Running this did not work as expected

$ node index.js

(node:5106) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
/..../yoga-graphql/index.js:1
import { createServer } from 'node:http'
^^^^^^

SyntaxError: Cannot use import statement outside a module

Sure, I can add type: "module" to my package.json, but then I get an error about it not finding schema:

Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/.../yoga-graphql/schema' imported from /..../yoga-graphql/index.js
Did you mean to import "./schema.js"?

Patching the schema import line to import { schema } from './schema.js' works, and the server is able to start. 🎉


A Carefully crafted "Getting started" page makes a good first impression. While these issues can be common, I think the page could be updated to mention these tricks and make the first contact more pleasant.

I see two ways to fix this:

I'll happily submit a PR going whichever way you prefer, thanks!

EmrysMyrddin commented 2 months ago

Hi @TPXP, Thank you for reaching out about this! We are in the course of improving our docs, and any feedback or help is very appreciated!

If you're willing to make a PR for this, I'm more in favor of making using the ESM standard. It's supposed to be the way to go for new project, so let's push this instead of pushing back to CJS syntax.

I think we are too TS minded in our docs, we should be more careful when we write JS snippets, because imports are slightly different than we are used to.