# Svelte and Solid **URL:** \ **Category:** Developer Experience\ **Created:** [October 25, 2020, 10:53pm UTC](https://forum.solidproject.org/t/svelte-and-solid/3535 "2020-10-25T22:53:34Z")\ **Posts on this page:** 12\ **Page:** 1
**Author:** ![tychi](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/tychi/32/1959_2.png) [@tychi](https://forum.solidproject.org/u/tychi)\ **Post date:** [October 25, 2020, 10:53pm UTC](https://forum.solidproject.org/t/svelte-and-solid/3535/1 "2020-10-25T22:53:34Z")
Just wondering, is anyone exploring using Svelte ([https://svelte.dev](https://svelte.dev)) with building Solid apps? I’m just starting to get into Svelte. Been doing frontend for 12 years, the last 4 with React. Svelte seems to answer a lot of questions React leaves open. I’m absolutely going to be investing further into Svelte personally and want to collaborate with others on Solid related abstractions. Happy to join in on any existing efforts 🙂 ---
**Author:** ![jeffz](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/jeffz/32/600_2.png) [@jeffz](https://forum.solidproject.org/u/jeffz)\ **Post date:** [October 26, 2020, 2:26am UTC](https://forum.solidproject.org/t/svelte-and-solid/3535/2 "2020-10-26T02:26:43Z")
@happybeing has worked with svelte and solid. If you search this forum (upper right of screen) you’ll find some of his past postings on the topic. ---
**Author:** ![julien\_leicher](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/julien_leicher/32/1961_2.png) [@julien\_leicher](https://forum.solidproject.org/u/julien_leicher)\ **Post date:** [October 26, 2020, 7:50am UTC](https://forum.solidproject.org/t/svelte-and-solid/3535/3 "2020-10-26T07:50:54Z")
I made some experiments with Svelte, Sapper actually. They prefer to use rollup instead of webpack and I’ve got some issues when using [solid-client-js](https://github.com/inrupt/solid-client-js) and [solid-auth-client](https://github.com/solid/solid-auth-client) when bundling related to the mix of `require` / `import` but I found some workaround. Feel free to ask if you got this too 😉 ---
**Author:** ![happybeing](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/happybeing/32/59_2.png) [@happybeing](https://forum.solidproject.org/u/happybeing)\ **Post date:** [October 26, 2020, 9:41am UTC](https://forum.solidproject.org/t/svelte-and-solid/3535/4 "2020-10-26T09:41:51Z")
I’m a big fan of Svelte and have built a few test apps using it but not specifically for Solid. I’ve made a few experimental things, particularly experimenting with visualisation, and that supports RDF. BTW @julien_leicher you can use webpack with Svelte, and I found this necessary to get it to work with some RDF libraries which tend to be out of date wrt JS, and rollup is deliberately intolerant of this to encourage folks to keep their modules up to date. There may be other ways around this but I couldn’t find them. Demonstrations of how to use some problematic RDF modules with Svelte and webpack are in this [repo](https://github.com/theWebalyst/svelte-with-rdf-libs-webpack). The most complete app, still really a testbed for my visualisation library/workbench ideas is [http://vlab.happybeing.com](http://vlab.happybeing.com) which has a link to my github repo where you find some other Svelte experiments, including some UI components. VisLab (just linked) uses the experimental UI components, and if you get into building similar, I found svench a very useful tool to help test and find bugs in my components. The author was also very helpful with my novice stumblings. Good luck @tychi, and please keep us posted. I’ve not done much with Svelte lately, but have just started a project to build a [p2p git portal](https://safenetforum.org/t/safe-git-ui-discussion/32793/24) (a github alternative in static HTML) and will be using Svelte with that. There’s quite a bit of ground work to do before I get to the front end though, as it will incorporate `git-bug` code written in Golang, compiled to Wasm. BTW folks, if any of you are in the fediverse I’ve moved my social media presence mainly to mastodon (as [happybeing](https://mastodon.technology/web/accounts/345164)), so please say hi! And if anyone wants to sign up, use this [invite](https://mastodon.technology/invite/CBcNbyjq). ---
**Author:** ![julien\_leicher](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/julien_leicher/32/1961_2.png) [@julien\_leicher](https://forum.solidproject.org/u/julien_leicher)\ **Post date:** [October 26, 2020, 9:52am UTC](https://forum.solidproject.org/t/svelte-and-solid/3535/5 "2020-10-26T09:52:03Z")
Yeah, I know but since svelte / sapper has been built with rollup in mind from the ground up, that’s why I gave it a chance, it was for experimentation after all 🙂 Didn’t know about [svench](https://github.com/rixo/svench), I’ll give that a look ! ---
**Author:** ![tychi](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/tychi/32/1959_2.png) [@tychi](https://forum.solidproject.org/u/tychi)\ **Post date:** [October 26, 2020, 7:25pm UTC](https://forum.solidproject.org/t/svelte-and-solid/3535/6 "2020-10-26T19:25:37Z")
Not sure if this’ll help with including some of those RDF libraries in Rollup, but I’m experimenting with including some React components in Svelte at work that depend on some older libs. Adding this code to the `plugins` array in rollup.config.js was able to unblock the errors I was getting related to bad imports. ```auto commonjs({ esmExternals: ['package-name', 'another-package-name'] }) ``` @julien_leicher, is this the solution you came up with too? ---
**Author:** ![julien\_leicher](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/julien_leicher/32/1961_2.png) [@julien\_leicher](https://forum.solidproject.org/u/julien_leicher)\ **Post date:** [October 27, 2020, 8:47am UTC](https://forum.solidproject.org/t/svelte-and-solid/3535/7 "2020-10-27T08:47:03Z")
Not the solution I came up with but maybe because the issue was different. When importing `solid-client-js`, there was a `require('cross-fetch')` which blow up the bundling. Since I was on the browser side, I just wanted to use the `window.fetch` function. I found a workaround by using the replace plugin like this: ```auto replace({ 'require("cross-fetch");': "window.fetch;", delimiters: ["", ""], }), ``` But maybe there was another solution, that’s the quickest workaround I’ve found. **edit:** Just retried my sample without this replace and looks like it works now, maybe I was wrong, I dit not have the time to investigate for now 😕 ---
**Author:** ![Vincent](https://avatars.discourse-cdn.com/v4/letter/v/e9bcb4/32.png) [@Vincent](https://forum.solidproject.org/u/Vincent)\ **Post date:** [October 28, 2020, 2:23pm UTC](https://forum.solidproject.org/t/svelte-and-solid/3535/8 "2020-10-28T14:23:29Z")
Feel free to [report issues](https://github.com/inrupt/solid-client-js/issues/new/choose) like that at any time, solid-client should definitely just work with Rollup (it uses Rollup itself, actually). Glad to hear it works now, but let me know if it regresses. cross-fetch is a dependency of solid-client, so it should be able to find it (and, if you’re in the browser, that should fall back to native fetch). (Sorry for going off-topic. Keeping a keen eye on Svelte indeed, though it’s not really at the top of my list of things to learn. I’m not particularly fond of how it takes of your entire toolchain and defines its own language, but that’s not necessarily a dealbreaker.) ---
**Author:** ![happybeing](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/happybeing/32/59_2.png) [@happybeing](https://forum.solidproject.org/u/happybeing)\ **Post date:** [October 28, 2020, 2:29pm UTC](https://forum.solidproject.org/t/svelte-and-solid/3535/9 "2020-10-28T14:29:27Z")
FYI none of my issues were with Sold libs but with libs used to process RDF, but which Solid libs are likely to depend on. More detail in this [repo](https://github.com/happybeing/svelte-with-rdf-libs-webpack). I think rdflib.js has changed in relevant areas though, so some of the information there may be out of date. ---
**Author:** ![tychi](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/tychi/32/1959_2.png) [@tychi](https://forum.solidproject.org/u/tychi)\ **Post date:** [October 28, 2020, 3:15pm UTC](https://forum.solidproject.org/t/svelte-and-solid/3535/10 "2020-10-28T15:15:57Z")
> I’m not particularly fond of how it takes of your entire toolchain and defines its own language, but that’s not necessarily a dealbreaker.) Honestly, a year ago I’d be in the same boat, but with the prevalence of TypeScript, I feel my toolchain’s already been hijacked by another language. Since we’re getting into widespread compiler in the toolchain territory now, I’ve decided to lean in to Svelte for the ergonomics. ---
**Author:** ![julien\_leicher](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/julien_leicher/32/1961_2.png) [@julien\_leicher](https://forum.solidproject.org/u/julien_leicher)\ **Post date:** [October 29, 2020, 10:54am UTC](https://forum.solidproject.org/t/svelte-and-solid/3535/11 "2020-10-29T10:54:53Z")
Maybe that’s because I missed something 😕 I’ve made a repo with my process to reproduce the issue and find a way to make it work without hacky stuff here: [https://github.com/YuukanOO/solid-on-svelte](https://github.com/YuukanOO/solid-on-svelte) ---
**Author:** ![Smag0](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/smag0/32/310_2.png) [@Smag0](https://forum.solidproject.org/u/Smag0)\ **Post date:** [October 31, 2020, 9:44pm UTC](https://forum.solidproject.org/t/svelte-and-solid/3535/12 "2020-10-31T21:44:35Z")
Perhaps a basic lazy workaround, I’m playing with vuejs with solid, but when a lib gave me some problem I put the lib.min.js in the index.html 😉. And focus on my app