SolidJS

Solid is a declarative reactive Javascript library for creating user interfaces.

SolidJS

Solid is a declarative reactive Javascript library for creating user interfaces.

8/13/2023

Solid Start with Prisma, when making changes to pages results in routing to 404 page.

I just started playing around with Solid Start and am using the Prisma template. I can spin it up just fine by generating the Prisma db with npx prisma generate and then starting the dev server with npm run dev -- --open. Everything works great. However, I'm having issues with the simpliest of things. If I go into the login form page and add a div element, the entire project breaks. Now instead of seeing a login page when at /login it fashes quickly and then I get the 404 error page. Interestingly, I can edit the names of the fields and that works, it's just when I try to add a new element. Why is this simple change breaking the project? This is really my first time working with SSR and Prisma for that matter, however I am pretty comfortable using Solid JS. Is there something I am missing? I've tried completely restarting the dev server incase it's an issue with the HMR, but I still get the same behavior....

oneiro

8/13/2023

What is the proper way to start solid-start in production (especially with something like pm2)?

Hey folks, I am currently running solid-start in production with a docker compose setup. Solid start is being run by first producing a build with running solid-start build and then invoking solid-start start. Is this the proper way to run solid-start in production? ...

Revxrsal

8/12/2023

onCleanup in Root component?

o/ so i have this component in my root. if i refresh the page, it doesn't log the cleaning up root!! message. is there any other way to run code when the app stops/refreshes?

onCleanup(() => {
   console.log("cleaning up root!!")
})

onCleanup(() => {
   console.log("cleaning up root!!")
})

...

Zanoryt

8/12/2023

Now using createResource(), the content never loads.

``` const getReports = async () => { return (await fetch('/api/reports')).json(); }; ...

DaOfficialWizard🧙

8/11/2023

Access child ref from parent component

Hello ya'll. I am having a bit of a brain fart, id like to access the child ref of an element from the parent. What is the best way to do this, ive done this before, but am having a brain fart atm.

bigmistqke

8/11/2023

`Suspense` deep dive 🐬

I am dealing with some inconsistencies in how Suspense works between react vs solid while working on #solid-three. I wanna check up if my understanding of their mechanics is correct: react - In react, a Suspense is triggered by throwing a promise. This needs to be done in either the component-body or the jsx, no effects/memos. All code will run until that point. The code throws before anything can mount, nothing runs after the throw: no useEffect and useLayoutEffect, child-components do not run. The suspense-boundary catches the promise and re-renders its children once the promise is resolved. - ✔️ <Suspense><div>{resource()}</div></Suspense> ...

TheOinkinator

8/11/2023

Createeffect not working in component where signal was defined

I am pretty new to programming so it is possible I have some kind of oversite. but in this code: ``` import FMHome from "./FMHome"; import FMSearch from "./FMSearch";...

Deva Kumar Kilim

8/11/2023

Replacing specific HTML elements with Solid Components

Hey. I have a string with html markup, I want to replace some specific elements (based on some attributes) with a Component. How can I achieve this? For example, const htmlMarkupString = '<div><span id="replaceMe"></span></div>'...

FjordWarden

8/10/2023

Render a component referenced by a object

How van I render a component that is referenced by an object instead of just writing the tag directly? For example I'd have a store where I want to programmatically change what ckind of editor is supported: ``` function View() {...

the magic guy

8/10/2023

solid start `npm run build` hangs in docker container

Trying to dockerize a solid application, built from solid start. It seems to hang at npm run build step, at solid-start rendering index.html.... Here is the docker file im using ```dockerfile FROM node:alpine3.18 AS build COPY package* ....

Jérémy

8/10/2023

server$ API change in start 0.3.1 ?

I'm trying to update to last released solid-start 0.3.1 when I use server$ from an API route endpoint, I get this exception Server function called without a request context? Does this ring bells for some of you?

𝓚𝓪𝔃𝓾𝓶𝓲

8/9/2023

Help with AList Cloud

I want to deply it myself and remove The "powered by AList" in the footer. And i dont know where to start.

apollo79

8/9/2023

exclude specific file from getting bundled

I'm using nanolith (https://github.com/mstephen19/nanolith) in my solid-start app for loading some work off to a different thread. However, it is not possible with this library to define and run the tasks in the same file, which I do not do in my code, but happens. Is there a way to somehow exclude the file from being bundled?

walid

8/9/2023

Components moved away from DOM

Empress

8/9/2023

How to properly import fonts (with Tailwind)

I’m using SolidStart + Tailwind for a project, and i can not import my font. I tried both importing it from the /public/ directory and using @fontsource (aka as a node module). If I put the import statement in my root.tsx, I dont get any error and it simply uses the fallback font. If I try putting the import in my entry-client.tsx I get a file not found error ( see attached screenshot). ...

theshadowboxers

8/8/2023

Resource with createContext?

What is the correct way to return a Resource from a context? If you don't provide an initial value then you get an error when trying to call the undefined returned from the useContext call as a function, but if you provide an initial value of () => {} it seems that the context isn't updated reactively when the value createResource accessor is passed to the value prop of the provider?

Ladvace

8/8/2023

Reactive var in obj

I have a context provider with an object, one of the property is conditional based on a prop you pass, what is the best way to handle the reactive property in this case? ```js const query = () =>...

deluksic

8/8/2023

Error handling in dependent memos

I was expecting that if one memo fails, all the dependent ones would also stop executing, see example here: https://playground.solidjs.com/anonymous/f51ce58c-1f57-4364-92a1-59bc7da54c59 How should I handle such a situation gracefully? Edit: This can cause downstream issues which are then raised instead of the original error, like no property bla on undefined. ...

Merlin

8/8/2023

Refetching Route Data with Solid Router

Is there any way to refetch (revalidate) the data functions with @solidjs/router? (not Solid Start; I'm using Vite) - I'm mutating something on the backend and would like to make sure the data is up to date - Returning the whole createResource return value kind of works -- calling refetch correctly refetches the data, but mutate doesn't work....

awala

8/8/2023

SolidStart unicode behavior

When I access a pages from parent pages down to the child pages, it renders the unicode perfectly, but when directly access it to the child pages from URL, it renders something like this â€¹. What possibly wrong? Is there any workaround?

Previous Next

Gaming

Programming

SolidJS

Solid is a declarative reactive Javascript library for creating user interfaces.

SolidJS

Solid is a declarative reactive Javascript library for creating user interfaces.