king8fisher
king8fisher•14mo ago

useEffect in the islands

Seeing a strange error in the browser window as soon as I add a simple as
useEffect(() => {
console.log('here');
});
useEffect(() => {
console.log('here');
});
No description
11 Replies
king8fisher
king8fisher•14mo ago
I'm basically using this structure on an island:
if (IS_BROWSER) {
useEffect(() => {
console.log('here');
});
useSignalEffect(() => {
// ...
}
if (IS_BROWSER) {
useEffect(() => {
console.log('here');
});
useSignalEffect(() => {
// ...
}
I hope someone has had something similar, any hints,
king8fisher
king8fisher•14mo ago
The exception is happening from this snippet:
No description
Deno AI Helper
Deno AI Helper•14mo ago
I'm sorry to hear that you're having trouble. However, the documentation does not provide any specific information about the use of useSignalEffect and useEffect together. It would be helpful if you could provide more details about the error message you're seeing. In general, useEffect is a hook from Preact (or React) that runs side-effects in your component, such as fetching data, setting up subscriptions, or manually changing the DOM. useSignal is a hook from Preact Signals, a state management library for Preact, that creates a reactive state signal. If you're seeing an error, it could be due to a variety of reasons such as incorrect usage of hooks, issues with dependencies, or conflicts between different pieces of state. As a debugging step, you could try isolating the issue by removing other code and seeing if the error still occurs with just the useEffect hook. If the error persists, it could be an issue with how your project is set up. If the error goes away, you can gradually add back other parts of your code to see what's causing the conflict. Remember, this advice isn't from the documentation, but it's a general approach to debugging issues in code. 🦕
king8fisher
king8fisher•14mo ago
Added a reproducible case: https://github.com/king8fisher/fresh-example/tree/demonstrate-use-effect-issue demonstrate-use-effect-issue branch @marvinh. tagging you since you replied to original message
GitHub
GitHub - king8fisher/fresh-example at demonstrate-use-effect-issue
Contribute to king8fisher/fresh-example development by creating an account on GitHub.
king8fisher
king8fisher•14mo ago
To be even more precise, it seems to break even when just a single useEffect is used. Collecting some notes from other issues to come out with a "rule of thumb".
king8fisher
king8fisher•14mo ago
GitHub
Can't define signal in async component or when using defineRoute · ...
I just tried making the Home function in a default 1.4.1 project into async and also tried using the new defineRoute method, but I got an error: An error occurred during route handling or page rend...
king8fisher
king8fisher•14mo ago
https://github.com/denoland/fresh/issues/1540 I think I found the issue @marvinh. It's a very smart auto-import.
marvinh.
marvinh.•14mo ago
oh no 😅 haven't had a chance to look at that yet
king8fisher
king8fisher•14mo ago
No problem I had to figure it out anyway 😄 It attempts to auto-import like so: import { useEffect } from "https://esm.sh/v128/preact@10.15.1/hooks/src/index.js"; and in reality it has to be .... from "react/hooks"; I've been bamboozle heavily.
marvinh.
marvinh.•14mo ago
ohh yeah, that likely lead to two different versions of Preact running at the same time. Hooks must use a singleton by design and both library versions can't see each other's variables
king8fisher
king8fisher•14mo ago
I'm sure I'll be bumping into this a lot. Leaving it as a no-fix issue for myself. (https://github.com/king8fisher/fresh-example/issues/1) Possibly: VSCode extension showing a bit more as to where the import is going to come from, as it shows 5 for useEffect and the first one in the list is surely enough the wrong one.
GitHub
Uncaught (in promise) TypeError: Cannot read properties of null (re...
This issue is not for fixing. It's to demonstrate how uncareful importing of a wrong function from the list that VSCode is providing can lead to hours of hunting for a non-existing bug. 54bedaf...