javascriptsvelte

Svelte 5: TypeError [Error]: entry.default.render is not a function


I am trying to upgrade a svelte app from version 3 to version 5. And I am running into this issue.

node:internal/event_target:1094
  process.nextTick(() => { throw err; });
                           ^
TypeError [Error]: entry.default.render is not a function
    at getMetadata (file:///.../project/.svelte-kit/output/server/chunks/entries.js:475:28)
    at file:///.../project/.svelte-kit/output/server/chunks/entries.js:491:45
    at Array.map (<anonymous>)
    at getEntries (file:///.../project/.svelte-kit/output/server/chunks/entries.js:491:18)
    at file:///.../project/.svelte-kit/output/server/entries/pages/about/_page.server.js:2:17
    at ModuleJob.run (node:internal/modules/esm/module_job:234:25)
    at async ModuleLoader.import (node:internal/modules/esm/loader:473:24)
    at async Promise.all (index 3)
    at async analyse (file:///.../project/node_modules/@sveltejs/kit/src/core/postbuild/analyse.js:66:16)
    at async MessagePort.<anonymous> (file:///.../project/node_modules/@sveltejs/kit/src/utils/fork.js:23:16)
Emitted 'error' event on Worker instance at:
    at [kOnErrorMessage] (node:internal/worker:326:10)
    at [kOnMessage] (node:internal/worker:337:37)
    at MessagePort.<anonymous> (node:internal/worker:232:57)
    at [nodejs.internal.kHybridDispatch] (node:internal/event_target:820:20)
    at MessagePort.<anonymous> (node:internal/per_context/messageport:23:28)

Node.js v20.17.0

The faulty code block is below:

const getMetadata = (entryType, filepath, entry) => {
    return {
        ...
        content: entry.default.render().html, // <---
        ...
    }

entry is something like Object.entries(import.meta.glob('<regex>', { eager: true})).


Solution

  • Read the migration guide. SSR is now done via an imported function.

    import { render } from 'svelte/server'; // v5
    import App from './App.svelte';
    
    // v4
    const { html, head } = App.render({ props: { message: 'hello' }});
    // v5
    const { html, head } = render(App, { props: { message: 'hello' }});
    

    If you migration from v3, you should also check the v3 => v4 guide.