REPL package on NPM is broken

[joci-tildeloop]

Please make the REPL package be available through NPM as a self contained package with a least the minimal documentation to make it usable.

I couldn't get the "@sveltejs/repl" package as it's provided through NPM to work so I played around with the package as is from this repo. It works with "marked" and "sourcemap-codec" packages added as dependencies. Also the way the package depends on "@sveltejs/site-kit" package made it impossible for me to make it work through NPM install so I included the "fonts" folder with "base.css" and "code.css" files to the package to finally make it work. It's too hacky to be viable as a proper solution and it would be nice to have the self contained package to be used through NPM that just works outside of the box.

[AgarwalPragy]

It will be really nice to have the @sveltejs/repl NPM package updated.

The easiest workaround mentioned below, unfortunately, runs into bundling issues which I'm unable to figure out

1. run pnpm install git+https://github.com/sveltejs/sites
2. import the component via import Repl from 'sites/packages/repl/src/lib/index.js
3. add the following dependencies mentioned here to your package.json

   "svelte2tsx": "^0.4.14",
   
   "acorn": "^8.7.0",
   "codemirror": "^5.65.1",
   "estree-walker": "^3.0.1",
   "rollup": "^2.67.0",
   "svelte-json-tree": "^1.0.0",
   "yootils": "^0.3.1"
   

The issues are caused by

1. the asset import in https://github.com/sveltejs/sites/blob/master/packages/repl/src/lib/Output/Viewer.svelte#L8 which Vite does not support for dependencies No loader is configured for ".html" files vitejs/vite#9932
2. importing rollup in https://github.com/sveltejs/sites/blob/master/packages/repl/src/lib/workers/bundler/index.js#L1

[joci-tildeloop]

There are much more issues that what you described. After 2 weeks of testing and toying around I've come to the conclusion that the REPL package in the current state is unusable as the NPM module and should be rewritten to accommodate SvelteKit SSR preloading or whatever it's called, I couldn't quite figure it out. Even with that Vite has a problem with bundling static assets of NPM modules that I couldn't figure out. I might document all of it if someone is interested but I think that the maintainers are aware of it since I figured it all out from mostly their comments on issues from the last year, but they clearly don't have the time to put into it which is understandable.

As of now I found that the REPL is usable if you import it as a Git Submodule/NPM workspace in the same way it's used in this repo. I have found also that with all of the fixes it will work in Preview as the NPM module if you import the package inside "onMount", but weirdly not on Dev I suppose because of Vite asset (pre)bundling.

[mskocik]

I have found that I needed to do following

☑️ add also @sveltejs/site-kit as a dependency
☑️ update vite.config.js according to svelte.dev
❌ After that the repl (added in onMount) loads, but fails to resolve esm module request (in dev) for jridgewell/[email protected]. That should be resolved by jridgewell/sourcemap-codec#3
♻️ When I commented importing and usage of Output/get-location-from-stack.js it began to work