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

"TypeError: u is undefined" when useState called from CDN import #3586

Closed
1 task done
neverstew opened this issue Jun 24, 2022 · 2 comments
Closed
1 task done

"TypeError: u is undefined" when useState called from CDN import #3586

neverstew opened this issue Jun 24, 2022 · 2 comments

Comments

@neverstew
Copy link

  • Check if updating to the latest Preact version resolves the issue

Describe the bug
When using the useState hook as imported from any CDN source, preact will crash and throw "TypeError: u is undefined".

To Reproduce
https://jsfiddle.net/vugyL4w9/

Expected behavior
I've taken the suggested jsfiddle from #2564 and adapted it so that we actually make use of the useState hook for a simple counter. I expected this to work.

I since tried swapping to pika and skypack as the module source, but both give the same error.

@JoviDeCroock
Copy link
Member

JoviDeCroock commented Jun 24, 2022

Gotta call hooks in components not just in the invocation else the hook doesn't know what vnode it is part of

import { h, render } from 'https://unpkg.com/preact@latest?module'
import { useState } from 'https://unpkg.com/preact@latest/hooks/dist/hooks.module.js?module'
import { html } from 'https://unpkg.com/htm@3.0.4/preact/index.module.js?module'

const Counter = () => {
	const [counter, setCounter] = useState(0);
	return  html`
    <span onClick=${() => setCounter(c => c+1)}>${counter}</span>
  `
}

render(html`<${Counter}><//>`, document.body)

@neverstew
Copy link
Author

Obvious! Thanks, @JoviDeCroock

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