SolidJS

S

SolidJS

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

Join

Solidstart + CF Durable Objects in one Project

I have seen the with-Websockets example, although I’m still trying to understand it. But since it is using Cloudflare’s Durable Objects I’d like to know if is possible to develop a Solidstart app + CF DO’s in one project and deployment. Has anyone tried this or are there examples?...

CreateLocalStorage hook problem with reactivity

I'm trying to make a custom hook that exposes a signal and uses the LocalStore of the browser. ``` import { Signal, createSignal } from "solid-js"; ...

Is there a way to untrack store reads?

The title says it all... I can see how to untrack signal reads but can't find similar functionality for store properties. Am I misunderstanding how stores work? Not reading the docs properly?

Abort resource

I am building some full text search input field and got the basic thing working. Next I want to add support to abort the previous fetch request because they can take a while and currently they build up with every token I type. This is my current attempt at a solution, but it has a problems. I never finishes the any fetch because it is aborted in the effect at the same time the resource runs. ...

Cant Change Store with unwrap

when I first unwrap the store and then I set the value its not updated: reproducible example: https://playground.solidjs.com/anonymous/650e10ae-8881-43d4-b1ff-7478e1a1c894

TypeError when using `createResource` in vitest

I'm new to Solidjs, and I'm learing how to test functions in vitest, it cause the error TypeError: Cannot read properties of undefined (reading 'id'), does anyone know how to solve it? there is no solution when asking ChatGPT🥲 ```ts describe('test createResource', () => { test('res', async () => { const [num, setNum] = createSignal(1)...

Vite app with Solid and React files simultaneously

I'm using a Laravel app in which i have several Solid components that I used in my traditional server side templates. I use Vite for bundling and transpiling these components with vite-plugin-solid and it worked fine until i added React and its Vite plugin (@vitejs/plugin-react) as I also plan to use React as my main "templating engine" with some Solid components sprinkled (e.g. with https://github.com/Sawtaytoes/reactjs-solidjs-bridge package). My guess is that Vite gets confused and either uses Solid to compile React's JSX or vice versa. Is there a way i can tell Vite some files use Solid's flavor of JSX and the rest use React's? Just like I'm telling TypeScript I'm using Solid's JSX in Solid component files by using @jsxImportSource pragma....

Solid JS to mixins or HOCs

I've got a situation where I'd like to create a component that modifies a specific type of child component. In React I would do this using a 'render props' function or a HOC. Is there an equivalent in SolidJS?...

Wrap each child

I would like to wrap each child in an element. For example I have a list element and I wand ever child element to be wrapped in a li element. What's the proper way of doing this? I can do it like this with the children helper function, but is this a good way of doing it? Should I try to avoid this situation? ```...

Using WebComponents in SolidJS

Hi, I'm trying to use Sencha WebComponents in SolidJS: https://docs.sencha.com/extwebcomponents/7.5.0/guides/getting_started/getting_started_existing_javascript_modern.html I got it working, however there are typescript warnings for every sencha element used (even though it works in the browser): ```html <ext-toolbar> {/* Shows a warning */}...

Any help for using Framework7 with SolidJS?

Hey! I'm trying to make a Capacitor app using SolidJS and want to use Framework7 (https://framework7.io/docs) with it. I want to be able to use Solid components, routes, ... inside Framework7. I'm currently stuck with their router. I was able to render a Solid component using ...

how come solid-js is devdependency for Solidstart

Hi just creating a new solid start project and noticed solid-js lists under dev dependencies and not dependencies, is it only needed during development ? And is this specific to solid start or a depends on how bundler is setup?

Hydration issues on navigation while hydration is ongoing

With a structure like this, navigation is enabled before hydration is complete. ```tsx <Sidebar /> <Suspense> <Outlet />...

Creating an Observable from a store.

Is there a way I can create an observable from a store? Essentially, what I want to do this: ``` import { observable } from “solid-js”;...

CreateEffect in a separate JS file

One of my component is having too many createEffects which looks quite messed up and cumbersome. I want to refactor it and keep those in a separate files. What are the possible ways to do it ? Would appreciate your help!

Are there any semantic or performance differences between `Show` and ternaries?

The docs say:
It is similar to the ternary operator (when ? children : fallback) but is ideal for templating JSX.
But I'm not sure in what way it's ideal for templating, is it talking about just DX or also ideal performance-wise?...

Signal set from localStorage not updating

I am setting a signal like: ``` const initialCart = isServer ? data.userData().cart.products...