Vite refuses to use the correct build target in my Svelte / TS project
I'm creating a website using THREE.js, Svelte, Typescript and Vite. When I tried to test a new THREE.js feature (WebGPURenderer), I got the following error in the build step:[ERROR] Top-level await is...
View ArticleHow to test Svelte component props with Vitest?
I want to test the props of a Svelte component with Vitest.Component:<script> export let foo</script><div>{foo}</div>Test:const { component } = render(MyComponent, { foo: 'bar'...
View ArticleHow to create unit test in Svelte using Vitest?
I have created a skeleton project using Sveltekit. I would like to create unit tests for three different files. One of the first files is the index.js under the src/lib folder:export function add(a, b)...
View ArticleVitest - Configuration Not Excluding file from Test Coverage in Sveltekit...
I'm currently working on a Svelte project with vitest for testing, and I'm facing an issue with excluding a specific file, myfile.js, from the test coverage. Despite configuring vitest with the exclude...
View ArticleSvelte - Extend standard html elements with typescript
I would like to define my custom component and specify which kind of "standard component" I would to extend.This to consume VSCode intellisense for all standard attributes of the extended component...
View ArticleNo scoped body style in Svelte
How do I style the body To achieve different styling for the "body" element on individual pages in Svelte, how can I avoid the":global(body)" in the style tags, which applies the same style to all...
View ArticleHow to add Tailwind CSS in SvelteKit official demo application?
I have created sample application by following steps given at https://kit.svelte.dev/docs/creating-a-projectnpm create svelte@latest my-appSo the project structure...
View ArticleFix Safari Error: "Fetch API cannot load... due to access control checks"
I'm creating a basic Sveltekit app with Firebase Authentication (with Google).In Chrome all works fine, but in Safari (desktop + mobile) I'm getting the following error:"Fetch API cannot load... due to...
View ArticleHow is component inheritance done in Svelte?
I currently have a Modal.svelte component that uses native , I would like to create another component called ModalSheet.svelte whose parent is Modal.svelte.Is this possible in Svelte without conflicts?...
View ArticleSvelteKit SuperForms message always undefined
I am developing a form with Sveltekit, sveltekit-superforms, drizzle, zod schema to be able to perform server-side checks of the form, the problem subsists in the fact that after performing the checks,...
View ArticleFlash Message Not Showing Up Sveltekit
I am experiencing problems showing flash messages in my application, the problem is that, following a form submit, after the server has handled the request, wanting to do a redirect with a flash...
View ArticleSvelteKit: how do I do slug-based dynamic routing?
I am a newbie on Svelte and in coding in general. I'd prefer to learn SvelteKit (Svelte@Next) rather than sapper since that seems to be where Svelte is heading.For my personal project, I need to...
View ArticleCan I set svelte style css attribute values using variables passed in to a...
I want to create a svelte component that receives the name and path of an image. I want to have the component set the image as the "background-image" using CSS.I've tried the following which does not...
View ArticleHow do you implement file upload on a Svelte app that works on all resolutions?
So the problem I'm having is fairly niche, so I'm not sure if this has happened to anyone else. In a Svelte app I'm working on, I tried to implement simple file uploading. Here is my folder...
View ArticleBundle JS and CSS into single file with Vite
I'm having a devil of a time figuring out how to build a single .js file from Vite in my Svelte project that includes all of the built javascript and CSS from my Svelte projects. By default, Vite...
View ArticleHow to put a value in page.data from form actions SvelteKit?
I'm just learning SvelteKit. I'm trying to authenticate. I did it like this:<script lang="ts"> import { goto } from "$app/navigation"; import Button from "$lib/components/Button.svelte"; import...
View ArticleClik here to view.
JS Syntax Error after deploying to CloudFlare
I have a static website built using Svelte (4.2.10) + Vite (5.1.1) + TypeScript (5.2.2).When I run the developmental frontend by running vite locally, it runs fine and renders without any problem. When...
View ArticleHow do get query string parameter in sveltekit?
I'm trying to the /login?ref=/some/path parameter to redirect to after login: const ref = $page.url.searchParams.get('ref') || '/dashboard';However I get this error:TypeError: Cannot read properties of...
View ArticleSveltekit - Consume rest api and use response data inside multiple components...
I have a page with multiple components, like tables and displayed in one page.My +page.svelte:<script>..<script><div class="page-content"><Row><Table1 /><List />...
View ArticleSvelte 5 - using $state for class field in TypeScript
I have a class:class TestClass { prop = $state('test');}It works in .svelte.js and .svelte files with <script lang="js">, but doesn't work in .svelte.ts and .svelte files with <script...
View Article