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/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...

ⱼ ₒ ₑ

1/17/2025

Solid Start Vinxi complaining about public and can't resolve public fonts

When I define my font faces and reference the actual font files like so:

url("/fonts/open-sauce/OpenSauceOne-Black.woff")

url("/fonts/open-sauce/OpenSauceOne-Black.woff")

It does not complain but when building it will state it can't resolve it....

ⱼ ₒ ₑ

1/17/2025

Solid Start HMR not rebuilding styles on class change

Use tailwind 4.0, change class of JSX component while dev server is running, HMR reloads component but tailwind is not rebuilt to actually style the class How could I fix this? In vite config?...

quinnvaughn

1/17/2025

Why is this code not reactive?

I have a TextField component that passes down information via context. Picture shown below. I am using @felte/solid as my form library. I'm trying to set validationState based on if there is an error in that specific value, however the code (show below) is not reactive and I'm not totally sure why. errors() is reactive and errors().scenarios seems to be reactive, and the div with the Errors: {errors().scenarios?.[i]?.name?.[0]} seems to work fine, so I can't totally understand why the vali...

snnsnn

1/17/2025

Best Practices for Handling Errors in a query-Wrapped Server Function

Hey everyone! I’ve been working with SolidStart and have a question about error handling and display strategies for server functions wrapped in a query. The example below is inspired by one of the official SolidStart examples: ```ts export const getUser = query(async () => { "use server";...

ⱼ ₒ ₑ

1/17/2025

How to use server function & suspense

I will be frank, I have some experience with React but this is my first dive into Solid coming from Astro I'm trying to have a fallback loading component, that is replaced by data fetched from the server when available I figured the best way to do this was an asynchronous server function, I am not claiming there is a bug I think I just did something wrong Here is my high-level code since I can't really share more: ```jsx...

andahendriksen

1/16/2025

Have anyone gotten ts particles to work in solid?

https://github.com/tsparticles/solid I've tried implementing the example they give, but it does not work....

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.