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

Error in Server Side Rendering. Need a valid ESM entry #5205

Open
kingyue737 opened this issue Nov 29, 2023 · 6 comments
Open

Error in Server Side Rendering. Need a valid ESM entry #5205

kingyue737 opened this issue Nov 29, 2023 · 6 comments
Assignees
Labels

Comments

@kingyue737
Copy link
Contributor

kingyue737 commented Nov 29, 2023

Describe the bug

I tried to introduce G6 in my Nuxt.js project but failed unless transpiling G6.
G6 cannot be used in Server Side Rendering, because it does not have a valid ESM entry.

check here https://arethetypeswrong.github.io/?p=%40antv%2Fg6%404.8.23
check also https://publint.dev/@antv/g6@4.8.23

Although G6 contains "module" in package.json, Node.js doesn't recognize the "module" field. Instead, we should use "exports" to increase compatibility with it. For example:

{
  "name":"@antv/g6",
  "exports": {
    ".": {
      "import": "./esm/index.mjs",   // IMPORTANT, use ".mjs" instead of ".js"
      "require": "./lib/index.js"
    }
  },
}

or with "type": "module"

{
  "name":"@antv/g6",
  "type":"module",
  "exports": {
    ".": {
      "import": "./esm/index.js",
      "require": "./lib/index.cjs"  // IMPORTANT, use ".cjs" instead of ".js"
    }
  },
}

I highly recommend to fix it in v5 before stable as it is a breaking change

Refs:
https://publint.dev/rules#has_module_but_no_exports
https://nuxt.com/docs/guide/concepts/esm#what-are-valid-imports-in-a-nodejs-context

Your Example Website or App

ignore

Steps to Reproduce the Bug or Issue

Load G6 in Node.js

Expected behavior

No error

Screenshots or Videos

No response

Platform

  • OS: [e.g. macOS, Windows, Linux]
  • Browser: [e.g. Chrome, Safari, Firefox]
  • Version: [e.g. 91.1]

Additional context

No response

@hustcc
Copy link
Member

hustcc commented Jan 26, 2024

We will consider the server side rendering feature in version 5.

@hustcc hustcc added the v5 label Jan 26, 2024
@kingyue737
Copy link
Contributor Author

🎉I just saw that ECharts would also support node environment in v5.5 apache/echarts#19513. It may also be a reference. Glad that the community has started to embrace the ESM-default package.

@hustcc
Copy link
Member

hustcc commented Jan 26, 2024

We have already added SSR (Server Side Rendering) capabilities in the new version of G2, so theoretically, it shouldn't be very difficult to do the same in G6. Please look forward to it.

@kingyue737
Copy link
Contributor Author

Awesome, I will consider replacing ECharts with G2 in projects depending on G6 since they share many dependencies.
It seems that the ESM entry of G2 is also not valid which may cause errors in some node environments:
https://publint.dev/@antv/g2@5.1.15
https://arethetypeswrong.github.io/?p=%40antv%2Fg2%405.1.15

Rule:

  • If the file has extension .cjs or .mjs, it will be recognized as CJS or ESM.
  • Else If the file has extension .js, find the closest package.json file, read "type": "module" or "type": "commonjs" (by default) to determine whether file is ESM or CJS.

The entry should be ./esm/index.mjs

@guxuerui
Copy link

We will consider the server side rendering feature in version 5.

你好,加上了吗,现在G6的5.0.18版本,在Nuxt3中,还是会有这报错。

@e610325502
Copy link

e610325502 commented Sep 21, 2024

hello,does the g6 support ssr function now?we want to use it in nodejs env。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

4 participants