SolidJS

S

SolidJS

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

Join

`React is not defined` error from a Solid library

I'm currently using overlayscrollbars-solid in a work project and for some reason am getting React is not defined. I've not had this error in any other part of our site but where using this library and I cannot for the life of me understand why it's showing up. The issue comes from the library itself (I added a screenshot on where specifically it's showing up) and am wondering if anyone else has encountered this / how I might fix it...
No description

Where to put <MetaProvider>

I want to use <Title> but i need to add this somewhere: ```tsx <MetaProvider> <Title>Website Title</Title>...

Using refs in list rendering

Is there any way to use refs in list rendering? In a <For> or <Index>, I'd like to have an array of refs, or generally a way to retrieve ref to an element in the list by index. I can't find any mention of it in the docs, and given that ref takes a variable or signal, I don't see how to assign a specific array key rather than a hardcoded variable.

Hydration error when using <Show>

Why <Show/> is giving me a hydration error here? i genuinely don't understand why. https://github.com/mrVinxyz/sldify/blob/tmp-docs/docs/src/components/api-reference.tsx...

Route to Escape SPA?

I am wondering if there is a way to specify a route (<Router><Route path='...' />...</Router>) such that it "escapes" the SPA and just loads an html page from the public directory? If so, where can I look for those docs?

API Endpoint Security Question

I'm converting some server functions to API endpoints. With server function, I use "use server" to keep sensitive data like API keys secure. Here's an example. ```typescript...

IoC and support for decorators

Sooo, I was trying to play with inversify to create a light DDD template around SolidStart, but after my first try, I ended up with tons of error. From what I understand, h3 does not support decorators at the moment. I tried to install some babel plugins, without success. Did someone succeeded to use IoC with (or without) decorators? What is your technique?...

Masonry code takes too long to open

I code for masonry but it takes too long to open. I think this code have more calculations to run like height. is it have optimized code? The main problem is masonry creates all HTML elements in the beginning and gets heights. ```Javascript import { createMasonry } from "@solid-primitives/masonry"; import { createBreakpoints } from "@solid-primitives/media";...

how can I colocate components in the routes directory

I have an admin dashboard page, and I have a specific component that’s only useful for those pages. Is it possible to put those components next to the route, or is there a better way? I’m using solid start please ping me when you reply...

How do I disable codesplitting?

Hey, I have a very basic SolidStart app. How do I disable ALL codesplitting? I have SSR turned off, and would like to have a setup where the app simply loads an index.html file that loads all of the JS the app needs ahead of time during initial load. Thanks in advanced!!

OAuth / OpenID Connect

What’s the simplest way you guys have found to implement a sign in with Google / Instagram / Apple in SolidJS?

Mass Normalization of Props

Hi all, I find myself in the situation of wanting to provide non-reactive alternatives for some component props, i.e. allowing other devs to provide any of ```ts interface SomeProps { foo?: Accessor<T> | T; // Accessor<T> | T | undefined...

css.preprocessorOptions.scss.additionalData is not working.

import "public.scss" is ok. but can't use additionalData . is vinxi not supported?
No description

Can anyone show code examples of how the permissions work?

I couldn't find a single example. In discord. Perhaps you have any ideas on this. I have never done permissions

Help Configuring SolidStart with Capacitor JS

I'm trying to turn a SolidStart project into a Capacitor app so I can create mobile apps for iPhone and Android. I’m new to this and struggling to fully understand how to integrate Capacitor with my SolidStart app. I have a few questions I hope someone can help clarify: 1. Capacitor and SSR/CSR:...

Which styling library to use?

Hi, I've read the docs, checked out many website and I just got totally confused which styling library to use with Solid + Vite. - macaron - https://macaron.js.org/ doesn't work, terminates with babel error. - https://github.com/solidjs/solid-styled-components 2 yr no commits - https://github.com/solidjs/solid-styled-jsx 2 yr no commits, however the main library it refers to still gets updates...

SSR with `query`

I'm trying to use @solidjs/router's query like this: ```ts const wait = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms)); ...

Use an action for a form but stay on the same page?

I am calling an action after submitting a form. I am navigated to https://action/1500021613?username= and then the page fails to load. I want the page to stay where it is after I submit. Thanks!...

Particles not working

I try given example in Particles but it not give any output. Can somebody provide me full code? https://github.com/tsparticles/solid...

using action/useSubmission, discern which button submitted the action?

i have a form with a create and a create & new, (the latter just creates the entity without clearing form/redirect/etc.) the issue is, i don't want to render a loading indicator on both buttons every submission, only the button that created the submission. is there a way to discern which caused the submission? i was thinking an extra param to the function, but it feels a little hacky as the param isn't actually used. open to any thoughts! thanks...