How to use Dynamic Components in Svelte 5 with Runes?
I have the following code:<script lang="ts"> import type { SpaceAmenities } from "$src/spaces.d"; import { Computer, Plug, Printer, Box, Droplet, Wifi, CornerDownRight, Icon, } from...
View ArticleHow to data bind with pageData?
If I bind directly to data, like:type Props = { data: PageData;};let { data }: Props = $props();<input bind:value={data.product.name} />I get the following warning:[svelte]...
View ArticleHow to use a global $derived in Svelte 5?
I'm trying to create a global state with Svelte 5 and runes:// store.svelte.tsexport const person = ({ name: '',});export const mrName = $derived('Mr. '+ person.name); // <-- problem!I can't make...
View ArticleHow to make sveltekit SPA app manage routes with golang backend when entering...
With having backend built in golang, frontend built in sveltekit as an SPA, how to make sveltekit frontend manage routes make in sveltekit, while having golang handle routes for api?For example: i...
View ArticleUnit test when there is style on the component
I'm checking out Svelte 5 and I have this simple component<script lang="ts"> let { name }: { name: string; } = $props();</script><h1> Hello! {name}</h1>I made a unit testimport...
View ArticleHow can I programatically authenticate a user in Auth.js?
I have a Django application with authenticated (logged-in) users.I have another (Svelte) application using Auth.js (https://authjs.dev) for authentication, currently set up with...
View ArticleSvelte:window component onload not triggering
In Svelte5, why is the onload event not triggering the function foo() in src/routers/+layout.svelte?<script> const foo = () => console.log('foo triggered')</script><svelte:window...
View ArticleSvelteKit + Capacitor: Images and Audio Not Loading in iOS Simulator
I'm working on a SvelteKit project with Capacitor to build a mobile app. The app should display images and play audio files. Everything works fine in the browser, but when I run the app in the iOS...
View ArticleUsing GORM models in frontend of Wails app
I'm building a desktop app with Wails which writes to a local SQLite database.I have the following model in my Go backend:type FilmGroup struct { gorm.Model Films []FilmRoll FilmOrder FilmOrder Status...
View ArticleMobile buttons not working with with stripe [closed]
I have a Sveltekit, supabase & stripe project. When going to my pricing page and clicking on one of the payment buttons it doesn't seem to do anything, not even open the stripe payment page but...
View ArticleNice way to load data in-time with Svelte
In Svelte, we have a very nice and beautiful way to load some data in time and render it using @const:<script> let a = false;</script><button on:click={() => a =...
View ArticleWhy "error Image is not defined" in svelte local, but working in REPL?
I'm getting this error:ReferenceError: Image is not definedThe code is in a component and looks like this: // Preload images for (const name in images) { (new Image()).src = images[name] }The only...
View ArticleStripe Payment Button Not Triggering on Mobile
I’m working on a SvelteKit project with Supabase and Stripe. On my pricing page, I’ve got buttons for users to pay and upgrade their plans. Everything works great on desktop when I click the button, it...
View ArticleI tried to import ccxt into my svelte kit app and got ReferenceError: Buffer...
I have a minimal reproducible example here about this issue. The issue is that import ccxt from "ccxt" gives this errorReferenceError: Buffer is not defined at...
View ArticleHow can I render a component in its own component (recursively) in svelte?
I'm trying to make a recursive component that acts as a sort of tree view, where the component takes in an array.App.svelte<script> import Tree from "./Tree.svelte" let name =...
View Articlehow to render another component inside the same cell?
I am rendering fine another component inside a cell in my tablecell: (info) => renderComponent(TokenLogo, { name: info.row.original.name, tokens: [ { address: info.row.original.underlying.address,...
View ArticleRetrieving the scroll position when the component is removed
In svelte 5, I want to store window.scrollY before the component unmounts to be able to restore it later.I tried console logging window.scrollY inside onDestroy, the cleanup functions of onMount and...
View ArticleNeed advice on how to store Encrypted verifier for PKCE auth0 workflow using...
I’m working on an authentication workflow using SvelteKit and Auth0, and I’ve encountered a challenge.Current Workflow:Login Endpoint:When a user is redirected to the login endpoint, I have a...
View ArticleClik here to view.
Viewing my site on a mobile scales a background image differently to a...
So I have a paragraph and an svg graphic (nearly a rectangle but with 'wavy' edges on the top and bottom) in my sveltekit site. I would like the SVG to stretch to fill the width of the screen and...
View ArticleDynamic import of fortawesome pro icons in svelte / vite
I'm attempting to dynamically import fortawesome icons in my sveltekit project, and struggling with the proper format. This is my test:onMount(async () => { let icons = ['faGear', 'faCarrot',...
View Article