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

How to use headlessui #557

Open
shrimpy opened this issue May 14, 2023 · 1 comment
Open

How to use headlessui #557

shrimpy opened this issue May 14, 2023 · 1 comment

Comments

@shrimpy
Copy link

shrimpy commented May 14, 2023

Anyone has any idea why i am getting below error?

SSR TypeError: Relative import path "client-only" not prefixed with / or ./ or ../ and not in import map from "https://esm.sh/v120/@headlessui/[email protected]/X-ZS8q/deno/react.mjs"
    at https://esm.sh/v120/@headlessui/[email protected]/X-ZS8q/deno/react.mjs:2:7
    at async importRouteModule (https://deno.land/x/[email protected]/server/router.ts:38:10)
    at async https://deno.land/x/[email protected]/server/renderer.ts:286:17
    at async Promise.all (index 0)
    at async initSSR (https://deno.land/x/[email protected]/server/renderer.ts:285:19)
    at async Object.fetch (https://deno.land/x/[email protected]/server/renderer.ts:26:41)
    at async routeHandler (https://deno.land/x/[email protected]/server/handler.ts:347:14)
    at async Server.#respond (https://deno.land/[email protected]/http/server.ts:299:18)

import_map.json

{
  "imports": {
    "~/": "./",
    "std/": "https://deno.land/[email protected]/",
    "aleph/": "https://deno.land/x/[email protected]/",
    "aleph/react": "https://deno.land/x/[email protected]/framework/react/mod.ts",
    "aleph/plugins/react": "https://deno.land/x/[email protected]/framework/react/plugin.ts",
    "aleph/plugins/deploy": "https://deno.land/x/[email protected]/plugins/deploy.ts",
    "aleph/dev": "https://deno.land/x/[email protected]/server/dev.ts",
    "aleph/server": "https://deno.land/x/[email protected]/server/mod.ts",
    "react-dom": "https://esm.sh/v120/[email protected]",
    "react-dom/": "https://esm.sh/v120/[email protected]/",
    "react": "https://esm.sh/v120/[email protected]",
    "@headlessui/react": "https://esm.sh/v120/*@headlessui/[email protected]"
  },
  "scopes": {}
}

usage:

import { Transition } from "@headlessui/react";

...
...
  <Transition>
  ...
  </Transition>

turn SSR off and seeing similar error from browser console

client.ts:24 Uncaught (in promise) TypeError: Failed to resolve module specifier "client-only". Relative references must start with either "/", "./", or "../".
await (async)
(anonymous) @ main.ts:3
@ije
Copy link
Member

ije commented May 15, 2023

try to use deno task esm add @headlessui/react

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

No branches or pull requests

2 participants