Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
TPXP opened this issue May 20, 2024 · 1 comment
Open

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

TPXP opened this issue May 20, 2024 · 1 comment
Labels
kind/docs Improvements or additions to documentation

Comments

@TPXP
Copy link

TPXP commented May 20, 2024

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:

  • switch the code snippets to the (old and terrible) require() syntax.
  • Mention that code snippets use the module standard, suggest to set "type":"module" in the package.json file, and fix the schema.js path.

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

@TPXP TPXP changed the title [docs] Suggest code snippets that work docs(Getting started): Suggest code snippets that work without changes May 20, 2024
@EmrysMyrddin
Copy link
Collaborator

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.

@EmrysMyrddin EmrysMyrddin added the kind/docs Improvements or additions to documentation label May 21, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
kind/docs Improvements or additions to documentation
Projects
None yet
Development

No branches or pull requests

2 participants