I am attempting to create a forge app using svelte because React is just not friendly.
Are there any svelte examples for this? I tried one svelteKit example, but it didn’t quite do it for me. I just need a solid starting point to be honest. If I can just get a svelte component to work inside of the overall Jira Issue Panel or somewhere else I think I would be able to make some headway.
I will be honest, I spent hours trying things that ChatGPT offered up and there was nothing that worked. It kept telling me to try al of these “useSvelteComponent” modules in Yarn and npm that do not exist. Then it tried giving me a bunch of links to download and none of them even existed (404 for every one). Yeah, not worried that ChatGPT will take my job that is for sure.
Anyway, if someone had figured out how to get a simple svelte component to work in a Jira Forge app please point me in the right direction.
Hi @DanBish ,
We haven’t specifically tried svelte in Forge, but we do have a Connect app that successfully uses Svelte, and we also have a Forge app that uses a non-react custom UI.
So, at least in theory, there should be no reason you can’t use Svelte in Forge.
However one thing that might be worth asking (and apologies if this is a silly question)…when you say “create a forge app using svelte”, you do mean a Forge Custom UI right? That is, you’re not trying to use Svelte in a UIKit app are you? (UIKit is “react-like”, but not actually React)
You mentioned SvelteKit, which is a meta framework (similar to Next.js), which typically consists of both a server-side piece and a client-side piece. I wouldn’t expect that to work (unless someone has built a SvelteKit adapter specifically for Forge?).
(EDIT: Ignore the above paragraphs…I can see from your other post on another thread that you’re using SvelteKit to bundle a static site for CustomUI.
But Svelte itself (the component framework) should be usable in Forge Custom UI.
You can use custom UI with Svelte.
The example project here will work: Forge deploy failure for custom ui forge app (Non React framework) - #3 by dubelm
After cloning the repo, run
forge register and
npm install in the root of the folder.
npm install and
npm run build in
forge deploy and
forge install in root.
Thanks for the note.
I am actually not wanting to use sveltekit. I just want to use a svelte component that I have created.
I tried a lot of things and as mentioned, they just do not work. I thought, maybe… perhaps… but nothing.
The closest I have found is to embed svelte into react (which is a bit nuts, but one of the Svelte creators published a video on how to do it).
Thanks, I saw this, and even tried it before posting here. It would not work for some reason.
Also, I am trying to use Svelte, not Svelte Kit. I don’t need all of the extra overhead, just svelte components.
I’m not too familiar with Svelte so I’m not sure what you mean by Svelte components but Custom UI will deploy whatever build folder you specify in your manifest. You can build your Forge app with any library or framework as long as you compile it back to html/css. If you mean using individual Svelte components in something like UI Kit, that won’t be possible. You can build an app in Svelte, compile it, and point your manifest to this build folder which will deploy and install this bundle
Here are links to a couple of YouTube videos that will get you where you need to be with React, so that you can use Svelte instead of just react. It is not straightforward to do, but at least you can do it, then you can just create the Forge App with react.
This one is by one of the Svelte Creator/Maintainers. He is really good!
This one is a bit broader, but the developer tells you how to use the Svelte in many other frameworks.
I hope this helps someone until #forge and Atlassian in general supports the Svelte ecosystem. It is too amazing to walk away from. Or perhaps they will at least support SolidJs
I haven’t done a Connect app “YET,” but I am certain it will make things easier. I was just trying to stay with what Atlassian is trying to force so that I don’t get left behind.