vercel / vercel/examples

Cannot find module jsx-runtime - web3-session template

Open
#461 6 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

help wanted
Dominant language
TypeScript
Stars
5.2k
Forks
1.8k
Avg merge
3d 12h
Merged PRs (30d)
6

Description

I followed the web3-session installation guide with:

yarn create next-app --example https://github.com/vercel/examples/tree/main/solutions/web3-sessions

I then setup my .env

Then proceeded to run

yarn dev

When I try to access: http://localhost:3000 I get the following error:

event - compiled client and server successfully in 100 ms (336 modules)
Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/web3-session/node_modules/react/jsx-runtime' imported from /web3-session/node_modules/@vercel/examples-ui/dist/index.js
Did you mean to import react/jsx-runtime.js?
    at new NodeError (node:internal/errors:372:5)
    at finalizeResolution (node:internal/modules/esm/resolve:437:11)
    at moduleResolve (node:internal/modules/esm/resolve:1009:10)
    at defaultResolve (node:internal/modules/esm/resolve:1218:11)
    at ESMLoader.resolve (node:internal/modules/esm/loader:580:30)
    at ESMLoader.getModuleJob (node:internal/modules/esm/loader:294:18)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:80:40)
    at link (node:internal/modules/esm/module_job:78:36) {
  code: 'ERR_MODULE_NOT_FOUND'
}
error - Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/web3-session/node_modules/react/jsx-runtime' imported from /web3-session/node_modules/@vercel/examples-ui/dist/index.js
Did you mean to import react/jsx-runtime.js?
Error [ERR_MODULE_NOT_FOUND]: Cannot find module '/web3-session/node_modules/react/jsx-runtime' imported from /web3-session/node_modules/@vercel/examples-ui/dist/index.js
Did you mean to import react/jsx-runtime.js?
    at new NodeError (node:internal/errors:372:5)
    at finalizeResolution (node:internal/modules/esm/resolve:437:11)
    at moduleResolve (node:internal/modules/esm/resolve:1009:10)
    at defaultResolve (node:internal/modules/esm/resolve:1218:11)
    at ESMLoader.resolve (node:internal/modules/esm/loader:580:30)
    at ESMLoader.getModuleJob (node:internal/modules/esm/loader:294:18)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:80:40)
    at link (node:internal/modules/esm/module_job:78:36) {
  code: 'ERR_MODULE_NOT_FOUND',
  page: '/'
}

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the web3-sessions example from the installation command and reproduce the failure with yarn dev. Read the installation guide and inspect the dependency path through @vercel/examples-ui/dist/index.js and react/jsx-runtime. Done means the example loads at http://localhost:3000 without the module-resolution error.

Written by the indexing model from the issue text.

Assessment

Tech stack
nextjs, react, typescript
Domain
frontend, tooling, web-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.