SolidJS

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

SolidJS

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

1/28/2025

Why do I end up with a server-fns for a number input component?

I noticed in the build log these lines (see attachment). I do not understand why I have the InputNumber component in the server fns assets: .vinxi/build/server-fns/_server/number-input.mjs 0.90 kB ...

message.txt

Đăng Tú

1/28/2025

Is there away to pass all variable to all children components

I want to do simple i18n: ```ts // i18n.ts file export default {...

Chris P Bacon

1/27/2025

Mixing async and signals

I have a -probably stipid- question: can I create a createAsyncMemo function? and how would I go about that? I am looking for a memo that can handle async browser api's. I thought that I could just use createAsync for this. however since it seems to be tied to the page's state I get a flickering page because the source signal I use has an internal use of createPolled. So in that train of thought I think the next logical step is to basically make a createAsync that is not tied to the router. But I am not having much luck, likely due to my limited knowledge in regards to signals. For some more concrete context, I have a function that I feed an Accessor<FileSystemDirectoryHandle> and this returns me a signal of all the .json files in that directory. Interally I also poll the files' lastModified so that my output signal is updated every time a file is CRUD'ed outside of my app. Next, and this is my problem code, I want to consume this file-list-signal. The file API's are however all async, and I often have trouble mixing async and signals. So guessing this is all due to a lack of knowledge on my part, how would I go about mixing async and signals best?...

wes337

1/26/2025

Solid-Meta on dynamic SSR routes

I am trying to set dynamically set metadata for Slack/X preview cards. ```js const getVideo = query(async (videoId) => { "use server";...

snorbi

1/26/2025

How to extract common reactive code?

I have some common code that I want to use in multiple components, like: ```tsx const [currentTime, setCurrentTime] = createSignal(getCurrentTimeMinutePrecision()) let timer: NodeJS.Timer...

quinnvaughn

1/24/2025

How to integrate Apollo Client into Solid Start with SSR?

I got Apollo working fine with my own custom functions/provider (solid-apollo hasn't been touched in 3 years and the author has made no attempt to fix anything, and I don't believe it supported reactivity in the variables anyways, so variables needs to be a function call in createQuery), but I'm having trouble getting it to properly work with SSR. The client on the server doesn't talk to the client on the browser and I was trying to go through the server rendering docs https://www.apollographql....

MrJohz

1/23/2025

How can I test that all computations were created in a root?

I have a complicated hook that creates a bunch of memos and other signals that have a somewhat complex lifecycle. I have tests that check that the behaviour is correct, but usually the clearest way I see that something's gone wrong is if warnings show up in the test messages. Is there a way that I can check that all computations were created in a root, and if possible, can I check that they were created in a particular root and therefore cleaned up when that root is disposed?

Ashraf C

1/23/2025

I have integrated @solid/meta in my solid-start project but I keep getting an error.

I have integrated @solid/meta in my solid-start project but I keep getting an error saying <MetaProvider /> should be in the tree. I don't know how to resolve this error even though I configured the MetaProvider at the root level and this is happening in different routes

Duncan

1/22/2025

Just using Filerouter from solidstart

If I just import the File Router from Solidstart into a non-start solid project will I be able to use it on it's own? I'm having to switch away from SSR for this app as I can't get the Arcgis modules to build through the vinxi process, but if possible I'd like to keep using the routing as I'm pulling some params from the routes.

MaveriX89

1/22/2025

Exception thrown when invoking useNavigate within Router root layout

I am having a real hard time working through this problem. I feel like I've tried everything but nothing has been working and there's probably something I'm not seeing clearly anymore. The short of it is, when I attempt to invoke navigate("/login") from my root layout component, I am greeted with the following exception: ```ts...

Duncan

1/22/2025

Solidstart project won't build

I have a Solidstart project that I'm running into a error I can't figure out on. For part of the app I use ESRI @arcgis/core modules, for those I use clientOnly which worked great. Everything works perfectly when run under dev mode. But when I try to build it it fails while attempting to transform of the @arcgis/core modules. This looks to be the source of the error: [8:45:46 PM] ERROR [commonjs--resolver] C:\code\solid\nodemodules.pnpm@[email protected]@[email protected]\node_modules@arcgis\core\layers\support\rasterFunctions\rasterProjectionHelper.js: Identifier 'e' has already been declared. (5:17320) ...

ChrisThornham

1/21/2025

Error when evaluating SSR module EVEN WITH ssr: false

I have a SolidStart project with file-based routing and ssr: false I'm using @revenuecat/purchases-capacitor inside of the project. When I use the revenuecat package in a file inside of the routes folder, everything works....

snorbi

1/21/2025

Solving "computations created outside ..." using `createMemo() ?`

I got the following warning because I used props.values in my event handling code:

computations created outside a createRoot or render will never be disposed

I have read the docs and some additional info (like https://github.com/solidjs/solid/issues/2130). The warning is gone when I simply wrap the props.values access in a createMemo():...

MaveriX89

1/21/2025

SolidJS SPA with Better Auth

I am trying to build a SolidJS SPA that uses the new Better Auth library to manage all things related to authentication/authorization for my app. Post all the needed configuration for it, on the SPA side, I have to use the Better Auth client to invoke all the auth related methods on my UI. I have one example here that I'm wrestling with in trying to get a redirect to happen after the user signs in but the redirect is not happening on the Solid SPA side: My Better Auth Client configuration: ```ts...

MaveriX89

1/21/2025

TanStack Query vs Solid Router

I'm looking to use Solidjs for a production app and have a question about a library I typically reach for (TanStack Query) for my SPAs and some of the built-in APIs for Solid Router: query + createAsync. Is there any reason to use TanStack when Solid Router comes with those built-in? Just wondering if there is something I'm missing because, the query + createAsync combination if I'm not mistaken provides a lot of the same benefits that TanStack does with request de-deduping and caching by key. Wondering if there are other gaps present that I am not privy to (e.g. easy request refetching/polling on interval or conditional fetching like the enabled field from TanStack Query). For the visually inclined -- the question is what is the recommendation between these two options and the pros/cons of each:...

Eric

1/21/2025

[astro-island] Error hydrating /src/components/SignUp/SignUpForm.tsx TypeError: conds[i] is undefine

How do I debug an error like this? The SignUpForm is an astro island with client-load (no difference when using client-only though)...

florian

1/20/2025

`scroll` event emitted until end reached when scrolling lazy-rendered table

I'm currently working on an app which displays a lot of data in a table that often has thousands of rows. To reduce the time spent while rendering the table I wanted to make it lazy-rendered so it just renders the rows in view and adds padding before and after the elements to correct the scroll position. The solution I came up with does just that but for some reason it keeps emitting scroll events when starting to scroll down until the end is reached, even when just increasing scrollTop by a few pixel and no manual scrolling at all. This doesn't happen when scrolling up for some reason? I created a minimal example that has the same behaviour like in my app here: https://playground.solidjs.com/anonymous/239274a9-b2f9-4c66-bb52-f9d69d40845f I know there are more performance improvements available but this would make the example just more complicated....

ken_binta

1/20/2025

@solid-mediakit/auth

I am trying to use @solid-mediakit/auth . But I keep running into this error when trying to create a protected route.

5:35:31 PM [vite] Error when evaluating SSR modulesrc/routes/protected/index.tsx?pick=default&pick=$css:
|- TypeError: __vite_ssr_import_10__.query is not a function

5:35:31 PM [vite] Error when evaluating SSR modulesrc/routes/protected/index.tsx?pick=default&pick=$css:
|- TypeError: __vite_ssr_import_10__.query is not a function

...

Josesito

1/18/2025

How does `query` cache actually work?

Caches are tricky and the docs do not explain the usage details, here are some questions: - When is the cached value invalidated? - Why do I want to use this cache? - When could I run into issues with stale data by using this cache? ...

quinnvaughn

1/18/2025

Any way to redo this logic without an infinite loop?

I have a page where I'm getting data from a createAsync and then dynamically rendering this in a <Show/>, however, to get the data to get guaranteed instead of possibly undefined I have to use the render prop, which goes into an issue shown here: https://github.com/solidjs/solid/issues/1149. Essentially I cannot use a <For/> loop inside this, as I get an infinite loop - I have to use an <Index/> loop. Is there some other way to do this pattern or am I basically stuck using <Index/>? T...

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.