onCleanup is running on server
When I put client side code in an onCleanup & then refresh the page the server crashes b/c it's trying to run the client side code on the server, super simple repo is:
1. npm create solid > Solid Start > Basic > TS
2. swap index.tsx for this:
import { onCleanup } from 'solid-js'
export default () => {
onCleanup(() => {
alert('index cleanup')
})
return <> <main> <h1>Index!</h1> </main> </> } Refresh index page & server crashes w/ error: /Users/chris/solid/cleanup/src/routes/index.tsx?pick=default&pick=$css:9 alert("index cleanup"); ^ ReferenceError: alert is not defined at Array.eval (/Users/chris/solid/cleanup/src/routes/index.tsx?pick=default&pick=$css:9:5) at cleanNode (file:///Users/chris/solid/cleanup/node_modules/solid-js/dist/server.js:140:68) ... Node.js v22.4.0
return <> <main> <h1>Index!</h1> </main> </> } Refresh index page & server crashes w/ error: /Users/chris/solid/cleanup/src/routes/index.tsx?pick=default&pick=$css:9 alert("index cleanup"); ^ ReferenceError: alert is not defined at Array.eval (/Users/chris/solid/cleanup/src/routes/index.tsx?pick=default&pick=$css:9:5) at cleanNode (file:///Users/chris/solid/cleanup/node_modules/solid-js/dist/server.js:140:68) ... Node.js v22.4.0
2 Replies
Put
onCleaup() inside onMount().ty Sir! very interesting gr8 to know thanks! this worked too btw!
import { onCleanup } from 'solid-js'
import { clientOnly } from '@solidjs/start'
export default clientOnly(() => Promise.resolve({ default: () => {
onCleanup(() => {
alert('hi')
})
return <></>
}}))