SolidJS

S

SolidJS

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

Join

Killing `pnpm dev` results in a defunct `esbuild` process

I've created a fresh solid start project with the default template. I noticed that pressing Ctrl+C causes a esbuild process to linger around in the defunct state.
11169 pts/1 Z 0:00 [esbuild] <defunct>
11169 pts/1 Z 0:00 [esbuild] <defunct>
...

Can't install or get a project started using SolidJs

I've checked some info from all available leads to resolve this but can't get a clear cut answer leading me to believe the issue is from my end but I don't know how to fix is. I've tried: upgrading bun clearing cache using npm...
No description

Why are both class and classList needed?

Hi, I just went through the tutorial on solidjs website. I'm hoping to understand the rationale between having both class and classList instead of combining their functionalities into just class. Thank you for any pointer you can provide!...

Solid Start Internal Fetch

Is there official or unofficial/hacky support for internal fetch at this point? The docs still mention it being passed to API route handlers but I'm not seeing that being the case (anymore?). Anyone figured out a working even hacky solution, directly calling Nitro internals or anything? (I sent this originally in #solidstart but realized this was probably the proper place for it)...

Multiple actions with different unique names seem to trigger each other's submission.result effects

Did I miss something obvious in the reproduction (stackblitz link)? It seams like the two components would be pretty isolated.
1. Open up the browser's console (stackblitz's console is not enough). 2. Let everything load and click the "Go 1" button once 3. Look at the browser's log....

How to prevent page reload on action / query

I use lazy loading, defining preload function, deferStream, and I can see visibly the data added in real time to the page but it forcefully refreshes the page How do I stop this? I didn't think server actions were meant to do this anyways ```ts ...

Preloading route data with context access

I want to preload data for a Home route nested within an authenticated web app. I am doing this by passing a preload function like so:
<Route path="/app/home" component={Home} preload={preloadHome} />
<Route path="/app/home" component={Home} preload={preloadHome} />
...

SSR blank page

Hi everyone, I'm having a little issue in solid start, when I'm using createAsync with the following query, the initial page response is blank, the page has two createAsync, one for the getSession an the other for this request to retrieve the guilds from discord, when there's only the getSession query the initial load of the page has elements rendered from the server and works as expected, I'd appreciate any help on this
No description

Is it recommended to use Start even if you don't need it?

Hello guys, I don't need any serverside stuff and would like to know if I should stick to Solid + Router instead? 🙂 Do I get any benefits from Start ( AFAIK it's not batteries included, I still have to install the router package )...

Prod Environment Variables Please

I'm maybe just doing something silly but when i do an npm run dev i can access env variables but not after an npm run build, i made a simple reproduction: - npm create solid => basic => ts app.config.ts: ```ts...

Which form validation library are you using?

Coming from React I really love https://react-hook-form.com/ Are you guys using Tanstack Form for Solid or what is the "most popular" one? 🙂...

A question about server side rendering an <a> tag based on requestEvent.

I am looking for a way to pre-render variants og the route as <a> tag based on requestEvent. I post my implementation down bellow....

Solid start call

Just getting into solid start. Going through this documentation to try and get api routes set up so I can fetch data: https://docs.solidjs.com/solid-start/building-your-application/api-routes I have two files that look like this ```ts // src/routes/index.tsx...

Possible bug? Solidjs lazy() caches network errors

We are developing a smart tv app and as a part of checklist process there is a requirement that app should correctly handle network outages. The problem I discovered is that solid's lazy function caches TypeError: Failed to fetch dynamically imported module. I was not able to recover from this error in any way other than restart app completely - errorboundary reset not working. ...

Stuck On A Build Error

I've been stuck on the following build error all day. ```bash ⚙ Preparing app for node-server... ✔ Generated public .output/public ...

NX setup with SolidJS and React

I have a monorepo where I create web components with SolidJS and take them into use in React. The app runs fine and individual libs builds ok, but I get error when I build React app: ``` libs\shared\ui\components\src\lib\tree\LoadableTreeAction.tsx:17:3 - error TS2322: Type 'import("C:/clients/node_modules/.pnpm/@[email protected]/nod e_modules/@types/react/jsx-runtime").JSX.Element' is not assignable to type 'import("C:/clients/node_modules/.pnpm/[email protected]/node_modules/solid-js/types/jsx").JSX.Element'. 15 | props...

data is rendering correctly on file save but not on page refresh

I am unsure exactly what is happening but when I refresh the page using create resource no data loads. However if I save the file in my editor suddenly the data pops up. I am assuming this is an issue with SSR somehow, but I do not understand what I am doing wrong. ```typescript import { createEffect, createResource, Show } from "solid-js"; import { createExternalApi } from "~/server/externalApi";...

What's the most common way (or the idiomatic way) of refreshing access tokens in a Solid.js SPA?

In my mind, there's two ways to refresh an access token via a refresh token - (1) check when the access token is near expiry using a timeout and (2) when we fetch a resource, we check the access token if it's valid and refresh from there (or when we encounter a 401 on initial fetch). for scenario 2, how do we ensure that we're refreshing the token only once if there are 3 parallel requests that intend to refresh the token independently? it's also talked about here https://discord.com/channels/722131463138705510/722131463889223772/974342456990654486 for scenario 1, is there a primitive that allows us to check the validity across different tabs to avoid having multiple timers or avoid refreshing the token at the same time? sort of like shared process or a shared state. for now, i'm using the createPersisted primitive and localstorage, and have other tabs check for TOKEN_REFRESHING before refreshing. i'm wondering if there's a better way?...

Track down server dependencies in client

Some time in the past 24 hours all my server dependencies started showing up in the client, which has completely broken my project. Is there any way to track down exactly why these dependencies are getting included (e.g., which import statement)?

Can I use Solid for rendering DOM elements under non-Solid parts of the website?

I'm using ProseMirror in one Solid component. ProseMirror takes a div, adds it's own children and populates it with it's own DOM elements. For simple elements it's OK, but for more complicated, interactive elements it'd be advantageous to use SolidJS. But how can I make Solid rendered/controlled DOM elements under a non-Solid part of the website? ...