Quantcast
Channel: Active questions tagged svelte - Stack Overflow
Viewing all articles
Browse latest Browse all 1541

Are dynamic imports at runtime in the browser (ESM) possible with Svelte?

$
0
0

Edit: I couldn't find a way so I exported the rendering outside the library that must be provided by the user in a callback.

I'm updating a Svelte component/framework library (using Vite / Sveltekit) that was created using npm create svelte. I'm using the default compilation setup.

The library must be able to render internally a Svelte component. However Svelte 5 changed the way this happen and I want to preserve compatibility no matter if the application using the library uses Svelte 4 or 5.

I added in the library a condition around the version. It gives something like this:

import { VERSION } from 'svelte/compiler';const SVELTE_MAJOR_VERSION = parseInt(VERSION.split('.')[0]);const { html, head } = await (async () => {    if (SVELTE_MAJOR_VERSION < 5) {        return SSR.render({ id, initialPage });    }    else {        const { render } = await import('svelte/server');        return render(SSR, { props: { id, initialPage } });    }})();return {    body: html,    head: [head],};

The package import('svelte/server') doesn't exist under Svelte 4 which is why I must somehow import it conditionnaly/dynamically. It seems that I can build successfully if I use Svelte 5 as a dependency, however I can't build it using Svelte 4. Also, the dist files generated when using Svelte 5 are not usable under a Svelte 4 application either.

In case this is of any help, here is the output of the failed build using Svelte 4 as a dependency.

vite v5.2.11 building for production...✓ 16 modules transformed.x Build failed in 199mserror during build:Error: [commonjs--resolver] Missing "./server" specifier in "svelte" package    at e (file:///Users/james/Projects/inertia/node_modules/.pnpm/vite@5.2.11_@types+node@20.12.11/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:47597:25)    at n (file:///Users/james/Projects/inertia/node_modules/.pnpm/vite@5.2.11_@types+node@20.12.11/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:47597:627)    at o (file:///Users/james/Projects/inertia/node_modules/.pnpm/vite@5.2.11_@types+node@20.12.11/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:47597:1297)    at resolveExportsOrImports (file:///Users/james/Projects/inertia/node_modules/.pnpm/vite@5.2.11_@types+node@20.12.11/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:48287:20)    at resolveDeepImport (file:///Users/james/Projects/inertia/node_modules/.pnpm/vite@5.2.11_@types+node@20.12.11/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:48306:31)    at tryNodeResolve (file:///Users/james/Projects/inertia/node_modules/.pnpm/vite@5.2.11_@types+node@20.12.11/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:48031:20)    at Object.resolveId (file:///Users/james/Projects/inertia/node_modules/.pnpm/vite@5.2.11_@types+node@20.12.11/node_modules/vite/dist/node/chunks/dep-cNe07EU9.js:47781:28)    at file:///Users/james/Projects/inertia/node_modules/.pnpm/rollup@4.17.2/node_modules/rollup/dist/es/shared/node-entry.js:19778:40    at async PluginDriver.hookFirstAndGetPlugin (file:///Users/james/Projects/inertia/node_modules/.pnpm/rollup@4.17.2/node_modules/rollup/dist/es/shared/node-entry.js:19678:28)    at async resolveId (file:///Users/james/Projects/inertia/node_modules/.pnpm/rollup@4.17.2/node_modules/rollup/dist/es/shared/node-entry.js:18359:26)

Viewing all articles
Browse latest Browse all 1541

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>