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

No build tools route debugging #185

Open
drjayvee opened this issue Nov 2, 2020 · 1 comment
Open

No build tools route debugging #185

drjayvee opened this issue Nov 2, 2020 · 1 comment

Comments

@drjayvee
Copy link
Contributor

drjayvee commented Nov 2, 2020

I've started developing using the stand-alone module from https://unpkg.com/htm/preact/standalone.module.js but realize that I really need the debugging tools.

The documentation says to import "preact/debug", but that's not a valid module specifier. There doesn't seem to be a debug standalone bundle on unpkg.

So alternatively, I might be able to adapt the following example code:

import { h, Component, render } from 'https://unpkg.com/preact?module';
import htm from 'https://unpkg.com/htm?module';

const html = htm.bind(h);

https://unpkg.com/preact/debug?module is not a thing, but the package preact/debug/dist/debug.module.js looks promising. However, it starts of with import "preact";, which doesn't work.

So my question is, is there a way to use and debug Preact + HTM without build tools?

If so, I'd love to make a PR for the docs.

@developit
Copy link
Owner

Hiya! The standalone.module.js build is super convenient, but this is its achilles heel.

The current easiest solution is to use a CDN that fixes this by precompiling bare specifiers to valid URLs, like Skypack:

// you can skip this since htm/preact returns it:
// import { h, Component, render } from 'https://cdn.skypack.dev/preact';

import { html, h Component, render } from 'https://cdn.skypack.dev/htm/preact';
import 'https://cdn.skypack.dev/preact/debug';

render(html`<h1>Hi!</h1`, document.body);

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

No branches or pull requests

2 participants