SolidJS

S

SolidJS

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

Join

Context is undefined during development reloads

So I use a few contexts like:
const useAppState = () => { return useContext(AppContext)! }
const useAppState = () => { return useContext(AppContext)! }
...

How to export solidJS project as module to be reused in others projects? Including typescript types.

How to export solidJS project as module to be reused in others projects? Including typescript types.

Production build failing

My project runs fine on the dev server, but I get an error when I try to run the production build. There's no assets folder in the hierarchy, as far as I can tell, so I don't know what it's trying to refer to. ```Error [RollupError]: Could not resolve "./assets/style-5d2e0917.js" from ".solid/server/entry-server.js" at error ((project dir)/node_modules/rollup/dist/es/shared/node-entry.js:2245:30) at ModuleLoader.handleInvalidResolvedId ((project dir)/inab-start/node_modules/rollup/dist/es/shared/node-entry.js:24650:24)...

`@solidjs/router` doesn't navigate in production mode

```ts export function App() { return ( <MetaProvider> <Title>SferaDel</Title>...

How to handle complex form?

Hey everyone, Exciting news! I'm currently taking on the task of transforming a portion of an existing web app into a Single Page Application (SPA) using Solid 🥳 Our present setup functions more as a proof of concept, with each field triggering a POST request to a server endpoint upon being edited (using the onBlur event), thanks to Remix. This triggers a server-side computation of the project, with the results reflected back to the user through the Remix mechanism....

SSR and routes in Solid.JS

On the Solid.JS website, it is stated that it supports server-side rendering (SSR). However, I am unable to find a straightforward method for SSR with routing. For instance, if I consider the following example: ```jsx import express from "express"; import { renderToString } from "solid-js/web";...

createServerAction$, ReadableStream, and createEffect are inconsistent across dev and prod

I have a route component that looks mostly like this, it creates a server action that makes an Axios request with the streaming configuration set to true (this part works). The action is submitted using the provided Form component, then I use createEffect to track the streaming response body content as it arrives. In dev mode, it works as expected with each chunk being added to the page as intended. But when I build and run in prod, the app waits until the entire request is returned before adding the whole response body to the page. This seems like a bug in the way createServerAction$ handles streams in Response objects, or maybe how createEffect treats the first item returned from the createServerAction$ array (prompt in this case)....

Best Practice for ContextProvider - Store vs Signals

When making a context provider is it best practice to use a store instead of several individual signals or does it not matter? E.g ``` interface Props {...

How to use Context/ ContextProvider with File Routes

If you are using FileRoutes and want to use a context around your entire app is there how exactly do you do? I've been using https://www.youtube.com/watch?v=ndB7PwS1yqk&t=309s as a guide but they don't use file routes. My assumption was to do this, in root.tsx...

*Npm Run Start* Fails To Mysterious Error

Is there a recommended way to debug solid-start start? I'm running into this issue where my app fails after I build, but in solid-start dev everything is fine. This is the error I'm getting: ```file://this/file/path/frontend/dist/server.js:17013 const id = sharedConfig.context.id + sharedConfig.context.count++; ^...

Async Await Issues

Not sure what is going on here, I think I'm just using async await incorrectly. I am unable to get the resource to load unless I console.log the value beforehand. I tried diabling SSR and it left me with response.json() is not a function...

Help with Script Loader

I'm attempting to integrate my FB/Meta Pixel within my SolidStart Store. Unfortunately whenever I try to integrate it my site either breaks or, the pixel doesn't fire at all. Any idea what I may be doing wrong.

SolidStart pRPC - No QueryClient set

I'm trying to do a basic server call to proxy a public API that has CORS. Here is the query: ```jsx...

solid-start: How to import browser-only depencency

I'm trying to include a browser-only dependency into a solid-start project that is partly server-side rendered. I.e. my vite.config: ```json export default defineConfig({...

Make createMemo depend on unmentioned signal

I have a createMemo that depends on a list of objects
const items = createMemo(() => props.articles.map((article) => article.id));
const items = createMemo(() => props.articles.map((article) => article.id));
...

refetch() from child component

I createResource (with refetch option) in my parent component. I render a child component in this parent and want to call the parent's refetch(). Obviously, that doesn't work because refetch() isn't defined in the child. How can I trigger the parent's refetch() from the child component?...

SolidStart progress communication

Please start using Github release feature so we know whats going on with the progress of this tool, your hard work currently is not being seen because of this communication issue. Thanks...

Run code on component becoming visible for first time

Hey all, I am working on a Tauri application using Solidjs as the frontend framework and am struggling to find a good way to run some code on a component becoming visible for the first time. Ideally, I am trying to make it so this function will run when a list item becomes visible for the first time in order to either download the appropriate image off the internet, or find it on the local disk. I have already created and tested the function to download and check for local images but I am strugg...

Use ErrorBoundary inside a createRoot?

I'm using a pattern where I have a globally accessible resource on a createRoot: ```ts export const [solidStore, updateSolidStore] = createRoot(() => { const [myResource] = createResource(...

HMR is not working

I am currently learning SolidJS and am having problems with HMR. I have created a SolidJS project with npm create vite@latest, in which HMR is supposed to work. So far I have manually updated all packages to the latest version and explicitly turned on HMR in the Vite plugin, unsuccessfully. Why could it not work and what can I do? ```json // package.json ...