How to have multiple pages/layouts under the same endpoint in Svelte?
I will preface this question by stating I am not a frontend developer.I am developing a pet project, where I have a form, and when the form is submitted, the user advances to the next "stage".For...
View ArticleHow to paginate text based on viewport?
I'm using SvelteKit and trying to split a long string into pages based on viewport. Basically, I need a similar functionality of an e-reader or Kindle, where it shows only the text that fits on the...
View ArticleAzure B2C Authentication with Sveltekit
I am trying to make users sign up and login using Azure B2C Tenant by clicking a Signup/Login button.I can't find any way to make this work and dont find any repo or code using msal-browser with...
View ArticleWhy is the popup of the mapbox showing under (vertically not on the z-index)...
map.addSource('unaza-goes', {'type': 'geojson','data': {'type': 'Feature','properties': {},'geometry': {'type': 'LineString','coordinates': [ [...] ] } } }); map.on('click', 'unaza-goes', (e: any)...
View ArticleIn WebRTC, I can establish a connection on my own computer, but I cannot...
https://github.com/chillyen/Funny-cat/blob/main/src/components/ChatInterface.svelteIn the ChatInterface.svelte file below, I have confirmed that my STUN and TURN servers can connect. However, in my...
View ArticleHow can I fix getting the error window is not defined
How can I fix getting the error window is not defined when using firebase in my sveltekit project I cant put it on mount because of other reasons and am trying to get around it? any ideas or is there a...
View ArticleMissing production environment in package.json, svelte/pm2
I want to deploy my svelte app using pm2.When I execute pm2 deploy production setup, I get this error:production environment is not defined in package.json fileHow can I define the production...
View ArticleApply different transition on smaller screens
I would like to apply a different transition when the device width is below a certain threshold. Similar to this question, but instead of just passing different transition parameters per breakpoint, I...
View ArticleSvelte Transition Direction Switch Issue
I'm using an each block to iterate over an array of items, and an if block inside that to check which of the items should be shown, and a fly transition is applied to the inner items with a variable...
View Articlesvelte dialog slide down animation
I have this svelte component and I want to do a slide down animation when it get's closed. The slide up animation is working, however the slide down not. Does anyone have an idea how to fix...
View ArticleSvelte/Typescript error : "unexpected token" during type declaration
So I have a Svelte application with TypeScript enabled but now I am having an issue for running it :[!] Error: Unexpected token (Note that you need plugins to import files that are not...
View ArticleUsing $env with SvelteKit and Docker
SvelteKit provides a good and easy way to use ENV variables:https://learn.svelte.dev/tutorial/env-static-publicIm using Docker in a CI pipeline to create images. However when running RUN npm run build...
View ArticleMake library available across entire svelte app
I'm Building my first app with svelte. Since I'm using axios to fetch data from my laravel api endpoint, I need to import axios across different components with some default settings, especially I need...
View ArticleHow do I listen to an event and change the value before I submit the form?
I have two components. One is my parent page which handle the submission, and my child component which receive the value from db.My parent pageconst submitEditForm = async (event: any) => {...
View ArticleClik here to view.
How to deploy Sveltekit app in node server with HTTPS?
I'm want to deploy my Sveltekit app on HTTPS server. I have key files also. This is my svelte.config.js fileimport preprocess from 'svelte-preprocess';import node from '@sveltejs/adapter-node';import...
View ArticleWhat is the best way to implement event handling on multiple list of child...
Let's say I have a to-do list. Each list item has a delete button which will delete the item from list array if clicked. Now we can use these methods.1.//store.tsexport type Item = { text: string; id:...
View ArticleSvelteKit Form Action not returning success / remains null
I have the following setup in my +page.server.js:export const actions = { createScore: async ({ request }) => { const values = await request.formData(); try { const instagram =...
View ArticleSvelteKit node adapter returning 404 for all application routes
I'm in the process of making SPA web application using Svelte and SvelteKit. I'm using node adapter and so far everything was fine, I prepared one test environment (running application with pm2 and...
View ArticleHow to use $$Generic with an array prop in svelte component?
I need to inject nested components through a property while keeping a strong typing.Using slots doesn't work for me because they don't allow me to switch easily between the components to be used. This...
View ArticleSvelte and Leaflet plugins not importing correctly
I want to add various plugins to leaflet, such as: leaflet.markercluster.On the internet I found an example to make leaflet work on svelte and I noticed that leaflet is imported via an asynchronous...
View Article