SolidJS

S

SolidJS

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

Join

Using renderToString in node

I have a file that looks roughly like this: ``` import { renderToString } from "solid-js/web" ......

styles.map.css is a route param for some reason

Hi all -- seeing this issue inside of a routeData function. ``` const routeData = ({ params }) => { return createServerData$(...

Unknown file extension ".ts" for rollup.config.ts

I'm using solidjs-community/solid-lib-starter and I'm getting this error. Any help?

Map return from createServerData

``` return createServerData$( async ([params]) => { const collectionMap = new Map(); const data= await xxx;...

Tauri

Alright, i decided to crate a suppport thread for this -as i have multiple questions. For starters i have migrated the app and the router from solid-start to solidjs with success. All of the previous issues i mentioned are now solved and working as expected. I have a new issue, two in fact. One major and one minor. ...

Argument of type 'string' is not assignable to parameter of type 'never'.

When using setState in a provider I get this error since the new update, is there any way to fix it ? Argument of type 'string' is not assignable to parameter of type 'never'....

Accessing cookies in routeData()

Is there any method to access cookies within createRouteData within routeData?

Testing SolidStart routes with Vitest

Hello! I'm using SolidStart and Vitest to test the components. But I didn't manage to find a way to test the route files (such as the index.tsx in my route folders, or the dynamic ones [id].tsx for example). I'm putting my test files.test.tsx next to the tested files, and the route ones kinda broke my app's routes. Do I necessarily have to move them somewhere else? And then, any idea on how I should render and test my routes? Does anyone has an example of good practices to test a SolidStart route? ...

NativeScript + SolidJS

What's the current state on this? I found this library https://github.com/nativescript-community/solid-js but not sure if that's production ready or not so if anyone have more informations about it, would be cool to know....

Creating a generic based component

Most of the examples I see for typing components look like this: ```ts interface MyComponentProps { // ... }...

Using FLIP Move with createServerData

I'm building a page that displays ranked results users can vote on. I pull the data from the routeData using createServerData. From there, I listen to a websocket to know when another user has made a change, and then refetch the routeData using refetchRouteData(). I feed the results of the route data into a different component that displays the results in order of rank. In this Results component I wrap the list in a <TransitionGroup> component from solid-flip. This animates nicely when new records are added and removed, but doesn't animate them nicely if they are rearranged. Instead I just get a sudden re-rendering of the results. I'm hoping to understand why the reordering animation doesn't work. I'm not sure if it's an issue with how I have it setup, or if it is a result of the data coming from createServerData. Any insight would be very helpful. Thank you very much...

Context hierarchy

I was using the create context and such, and found a weird behaviour that even with a context hierarchy still using default values ```tsx <CounterProvider> // context provider is here <App/> // counter is here but still using default behaviour...

Info from Children to Parent

Hi guys sorry for my noobish question, i came from svelte where to pass something from the children to the parent (in this case a function), in the children i do
export let handler = ()=>{}
export let handler = ()=>{}
...

Facebook/Twitter share implementation?

Hi guys! I've never had to do this before, and I'm wondering if maybe someone had an example of implementing Facebook and/or Twitter Share systems in a solidjs app? I have a "base" I can sort of duplicate but it's an overengineered reactjs code thing and I would much rather do something that's as clean and simple as possible. Is it really necessary to dynamically inject the javascript and such into the <head> for all this to work? I'd love some guidance!

renderStream not working after build

Hey, I've switched to renderStream and I've made an artificially delayed routeData with an <Suspense /> boundary. All is good in dev mode. I see the loading indicator from Suspense and the data popping in. But after pnpm build && pnpm start, everything looks like renderAsync again. White page until the data is ready. ...

How to handler this standard ReactJS pattern?

In React, I would normally do something like this: ```ts <For each={autoCompleteStore.options}> {(option, optionIndex) => {...

When is `keyed` useful for `<Show />`

The docs don't have a great explanation. My best understanding is that it allows you to use the value that the Show depends on in the rendering of the show but every time i've used a show it's been with a signal. Should I be using the keyed pattern or just reuse the signal? Example: ```jsx // not keyed...

Value returned from routeData is undefined

The value returned from routeData isn't defined, even after waiting before accessing

is there an isServer signal or boolean?

I need to ssr a loading state always from the server as the actual data is in users localStorage so ssring not found state doesn't make much sense. Thanks...

Lexical (or another)

Hi, I tried to make a poc with Lexical again. Did you also have a bug that blocks the delete? Or did I do something wrong? (my goal is to do like discord, everything is displayed with only a visual improvement)...