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

Multi deno.json resolver scopes fails for JSX #24293

Closed
sant123 opened this issue Jun 20, 2024 · 10 comments · Fixed by #24345
Closed

Multi deno.json resolver scopes fails for JSX #24293

sant123 opened this issue Jun 20, 2024 · 10 comments · Fixed by #24345
Assignees
Labels
bug Something isn't working correctly lsp related to the language server workspaces

Comments

@sant123
Copy link

sant123 commented Jun 20, 2024

Version: Deno 1.44.4

From #24206

I have a web application that renders HTML with hono/jsx. However I want to create some aliases for my JS client to use React.

This is my project structure:

image

deno.json (server)

{
  "lock": false,
  "compilerOptions": {
    "jsx": "react-jsx",
    "jsxImportSource": "hono/jsx"
  },
  "imports": {
    "@unocss/core": "https://esm.sh/@unocss/[email protected]",
    "@unocss/preset-uno": "https://esm.sh/@unocss/[email protected]",
    "@unocss/reset": "https://esm.sh/@unocss/[email protected]/tailwind-compat.css",
    "hono": "https://deno.land/x/[email protected]/mod.ts",
    "hono/html": "https://deno.land/x/[email protected]/helper/html/index.ts",
    "hono/jsx/jsx-runtime": "https://deno.land/x/[email protected]/jsx/jsx-runtime.ts",
    "$std/": "https://deno.land/[email protected]/"
  }
}

Notice how client.js is in red, this is because it can't resolve react which is expected:

image

So I add a deno.json on the client:

{
  "lock": false,
  "imports": {
    "react": "https://esm.sh/[email protected]"
  }
}

Now client.js is in green:

image

But Layout.tsx now fails because is loading React JSX by default but hono/jsx:

image

Is there a way to apply JSX configuration only to the directory that holds deno.json on the client? Notice Layout.tsx is a folder upper static folder; so it should read the configuration of deno.json on the server.

image

Thanks.

@sant123
Copy link
Author

sant123 commented Jun 20, 2024

FYI removing the deno.json on the client makes Layout.tsx work again:

image

@nayeemrmn nayeemrmn self-assigned this Jun 20, 2024
@nayeemrmn nayeemrmn added bug Something isn't working correctly lsp related to the language server labels Jun 20, 2024
@nayeemrmn
Copy link
Collaborator

I can't reproduce this, the TSConfig including the jsx configuration should be sourced from the deno.json at the root directory. Can you show the contents of the output panel?

@nayeemrmn
Copy link
Collaborator

Okay I reproduced it, it's happening because the static subdirectory imports react, which pollutes the global type environment into using react instead of hono somehow. This may end up being blocked on denoland/vscode_deno#488.

@sant123
Copy link
Author

sant123 commented Jun 21, 2024

Thanks for the reply @nayeemrmn, so should this be closed as duplicate of denoland/vscode_deno#488?

@nayeemrmn
Copy link
Collaborator

Let's keep tracking it here as well for searchability.

@KyleJune
Copy link
Contributor

I'm having a similar issue even though I have a single deno.jsonc file. I verified it was related to the same commit by checking out the one before to verify I had no issue then, and checking out the commit for multi deno.json resolver scopes.

#24342

@sant123
Copy link
Author

sant123 commented Jun 29, 2024

With Deno v1.44.4 this is still failing for me. Please take a look:

Screencast.from.2024-06-28.23-03-09.mp4

@sant123
Copy link
Author

sant123 commented Jun 29, 2024

Please @nayeemrmn could you take a look? Am I missing some configuration to make it work properly?

Thanks 🙏🏼

@nayeemrmn
Copy link
Collaborator

@sant123 The feature hasn't released yet, try with deno upgrade --canary.

@sant123
Copy link
Author

sant123 commented Jun 29, 2024

I knew I was missing something, it works like a charm with Deno canary:

Screencast.from.2024-06-28.23-14-31.mp4

Thank you so much @nayeemrmn !!!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working correctly lsp related to the language server workspaces
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants