SolidJS

S

SolidJS

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

Join

How can I make sure that data from createAsync is loaded, before passing it to another function

No matter what I do dirID is always undefined when it gets to other functions, createEffect also did nothing for me but that might be because I used it incorrectly. ```ts import { createSession } from "@solid-mediakit/auth/client"; import { createAsync, useParams } from "@solidjs/router"; import { Show, For } from "solid-js";...

Is createAsync supposed to work with Suspense?

My Suspense component is not working well with createAsync. Basically, anything iside the Suspense block is running even though the promise from createAsync hasn't finished. I've got a fairly simple setup that's failing and I'd love to understand if this is by design and expected, or something that I'm doing wrong, or a bug: Simple SolidJS app with Solid Router. No SSR, no SolidStart. Classic component routing. The result is an uncaught error stating result() is undefined......

<Title> Component Throwing Error. Can you help?

I built an SEO component that simplifies adding SEO to pages. Unfortunately, I'm now getting the following error on every page: "seo.tsx:20 computations created outside a createRoot or render will never be disposed"...

Issue deploying Solid Start server functions on Vercel

Hi all, i'm having trouble getting functions with "use server" to run correctly on Vercel. The App iteslf runs just fine - using SPA routing etc all works. Locally, the server functions also work, but once dploying to vercel I get 405 Method not allowed. I have set up the preset ```...

Per-route CSS when using FileRoutes

If I want to have a CSS file for an individual route (i.e. that route has unique page flow compared to others), where should I put the CSS file? It seems incredibly inconvenient to have CSS files in a separate folder. ```tsx // routes/index.tsx import "./index.css"; // Where should this file be?!...

Server functions returning page not found

After trying to upgrade to solid-start 0.3.11, I picked up a bug that did not exist in 0.3.10. The strange thing is, downgrading did not fix it. There are server-functions that, instead of running, return my 404 not found page. Any idea how to debug this? My app is not usable.
Could this be related to pnpm workspaces? This server function still works and it is in my main package: https://code.local:3000/_m/src/services/fetchMember.tsx/0/fetchValidatorMembers But this one, imported from another package in the repo, returns a 404 not found html page:...

is this a good pattern?

```tsx export default function Home() { const user = createAsync(() => getUser()); const shouldRedirect = createMemo(() => !user()); ...

Mutating a resource

The usecase is that I have comments on a post, and when a new comment is made, I want it to instantly appear on the page without requiring back-end confirmation. My page is set up ina way where I get a post from the server which has a children field which is array of comments. I create a copy of the post object, add the new comment to its children field, and then pass the whole thing to mutate as an arg. However it seems that mutating isn't reactive. The resource value does change (I can test it by console logging) but it doesn't change anything on the page. ...

How to store JSX element in a signal and render it from other elements

I have created a dialog system using context where the dialog that I want to render is stored via a function provided by context and the provider is the one that renders the dialog: ```tsx import { render, Portal } from "solid-js/web"; import { createContext, useContext, createSignal, type JSX, type Accessor } from "solid-js";...

How to make range input element reactive

```tsx const [step, setStep] = createSignal(0.01); <div> <label for="step">Step</label>...

Why is this not reactive? (using signal + html open attribute)

I have the following code: ```ts const [openMenu, setOpenMenu] = createSignal<boolean>(false); <details...

how do i dedupe requests without `cache`?

i tried everything. it always calls the function either twice or even thrice on client, after the server fetching the data too.

Is there a way to prevent `lowercaseevent` names?

From time to time, I have to write such PR reviews to tell the person not to use lower case event names. It is getting repetitive and annoying for everyone involved. Ideally, IDE would tell them this instead or even autofix. Anyone has a solution for this?
No description

Issue with Solid JS Routing After Deployment

Hi everyone, Today, I finished my project. However, when I tried to build and deploy it on Cloudflare/Vercel/AWS, I encountered an issue. During deployment, Solid JS doesn't route anything, and when I navigate to the login route, it doesn't display anything. This problem doesn't occur when I run the project locally; everything works as expected. Does anyone have any idea what might be causing this?...

How to pass props to context reactively?

I have a context that accepts props and then provides the prop values to its consumer components: ```tsx type FormGroupProps = { hasError?: boolean, name: string, children: JSXElement }; ...

Is there a way to access children props?

Ih this code: ```ts import { render, Dynamic } from "solid-js/web"; import { children, type ParentProps, For, createEffect } from "solid-js"; ...

is there a way to disable default lazy loading for routes in solidstart?

it seems routes are download when a link to them is clicked and then cached. is there a way to just download all routes on any route like solid spa?

Granular update of store array doesn't trigger effects depending on the whole array

I am really puzzled with proper setup for store array management. I am creating the array in the store: ```ts const [store, setStore] = createStore({...

Need to add a Babel plugin to solid start

Hi Solid Start Team, I need to add the following babel plugin to a solid start project: https://babeljs.io/docs/babel-plugin-proposal-decorators I cannot figure out how to add it to the app.config.ts file, SOS...

EventSource's response has a MIME type ("text/html") that is not "text/event-stream".

I'm trying to make SSE, but when i load the website I'm getting that error in the console of the website: EventSource's response has a MIME type ("text/html") that is not "text/event-stream". Aborting the connection. I'm just confused how and where to fix that....