SolidJS

S

SolidJS

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

Join

"use server"; Help

I'm trying to understand how "use server"; works. Is it safe to assume that everything under "use server"; runs on the server (of course scope dependent). So, inside of the following function, only console.log(message); could run on the server....

Documentation related to SolidJS Router

There some changes have been made in SolidJS Router installation, but the related documentation is not updated on website. The documentation is available on GitHub repository but same is missing on the website.

Best way how to call sever function onClick (SOLVED)

Hi iam just playing with solid but still cant find best way how to call server side action from simple onClick. I can use API url to call it there i can prepare data and return them. But i think there must be something better?...

Referencing Solid without breaking any Licensing issues

I am making a closed-source app using Tauri and SolidJS. In my Settings section, I want to make an About sub-section where the users can donate to me and several other open-source frameworks using my app. I want to make a section for Solid, but that would mean I would have to use the logo and mention the company's name. I was wondering: would there be any legal/trademark issue I could incur from this?...

type narrowing signals

I've got some state (I'm making a card game) that looks like ```ts type GameInProgress = { state: "playing" | "paused"; p1Flipped: boolean; p2Flipped: boolean;...

SolidStart Beta 2 Docs

Are there any up to date docs for SolidStart Beta 2? The current docs still reference root.tsx.

React.createElement equivalent?

Trying to make a little library which exports a component. The component's JSX is simply return <div ref></div>, hence i'd prefer not to use JSX itself, to simplify the build pipeline. Is it possible to do so without JSX?

Beta2: Server init hook?

How do I hook into star initialization so can perform async setup step ahead of start starting (e.g., async call to secrets store to get secrets needed for app to run). Thanks!

Beta2: How do I render html attribute server-side

Previously (beta 1) was using root.data to pipe in value so available could set theme and other props on the root html tag, but that no longer exists. Any ideas?

Avoid re-rendering toolbar in solid router 0.10.x

I have a SPA using with a common toolbar in between all the pages and using config based routing with useRoutes. It's similar to the example from the 0.9.x docs: ``` function App() { const Routes = useRoutes(routes); return (...

Using script tag with custom parameter

<script async src="https://umami.domain.org/script.js" data-website-id="ba170e55-8r926-4fc2-a36f-a4ggrbbcd2ebd83"></script>
<script async src="https://umami.domain.org/script.js" data-website-id="ba170e55-8r926-4fc2-a36f-a4ggrbbcd2ebd83"></script>
and this is my solid code root.tsx...

setState variable as path doesn't work

The following works ```ts setState("items", "collections", (collections: ItemCollection[]) => [...collections].filter((collection) => collection.id !== collection_id...

Solid Router 0.10.x double render of App

~~Just upgraded to 0.10.5 and the migration of code was simple enough, but running into a weird scenario where if I have a wrapper element in my <App> it gets rendered twice, whereas if I just have <>...</> it renders fine. This causes double rendering (two 'standard-grid' divs, two menus etc). ```TypeScript const App = (props: { children?: JSXElement}) => (...

Solid-js router 0.10.x cache invalidation

Hi, I started migrating an app from solidjs router 0.9.x and 0.10.x. The new caching and preload features are nice, but I'm having some trouble with testing. In my test setup I intercept API requests and inject different stubs for different tests. Since the tests run fast, the new solid router cache function does not invalidate the cache from one test to the next, causing some tests to get API responses made for previous tests when making the same API requests. I looked at the source code of cache and there seems to be no way to invalidate the entire cache. I saw that there is a cache.set function there but it seems it can't be used for invalidating individual caches. Are there other tricks I can use to achieve this behavior? I really don't want to change components' code to fetch without caching for tests, so it would be interesting to have some sort of cache.clear to invalidate the entire cache for testing purposes....

Polyfilling ecmascript features

Hey! Not experienced with polyfills, but now I'm trying to wrap my app into android webview and I want to support e.g. chrome 80+. And there are some things that not supported, Object.hasOwn What's the recommended way to add polyfills with default stack (Vite + solid.js)? I tried adding core-js with babel preset to solid otpions, but seems like Vite doesn't handle it right in dev-mode, as core-js is written with require....

Why does solid-router break DaisyUI styles?

I have a solidJS app all setup and have used daisyUI for styling. However, when implementing solid-router, it breaks some of the functionality of the styling... especially the themes (no more dark mode sadcat ) Any thoughts or ideas? If you'd like to see any parts of my code feel free to ask!...
No description

does Effect have a number limit?

I mean whether the numbers of createEffect have a limit or official advice? For instance, In the user authenticating scenario , I have created an effect to set the state as user logged in successful and then set the access token signal, so that resource could be created by the token as the source signal . What's more, there is another effect I have created to refresh the token signal when access token has expired . In this effect, a function will be called to refresh access token and return a valid one when the response of resource implied token expired information. Is two effects or even more in an APP proper? By the way, which is the better choice between function and async function the second effect? I think normal function is better, because that the token should be refreshed firstly. Or any other advices? thanks a lot...

When to use data.loading vs <suspense>

Somehow in createresource i cant use <suspense> unless i put 'data()?. Something'

Development vs Build variables - using Vite

I have a SolidJS site working nicely. In the Vite development environment I have a variable called "server"...
const server = "http://localhost:3020"
const server = "http://localhost:3020"
but when I want to build it using "npm run build" this variable need to change......

Is there any way of caching an image loaded from a url?

I've got images stored on supabase's storage and the first time a component renders, it creates a signedUrl and uses that url within the image element. However, this happens each time the component re-renders. I wish to avoid the loading time by caching the image itself, not the link. Is this possible? If so how? Could the image data be cached in solid store?...