Skip to content

Is there a way to eval or import JS at runtime? #142

@KonnorRogers

Description

@KonnorRogers

Basically, I'm trying to use Extism to SSR lit, and part of that is the components need to be loaded onto the global context. I have something basic like:

import {render as ssrRender} from '@lit-labs/ssr/lib/render';
import {collectResult} from '@lit-labs/ssr/lib/render-result.js';
import {unsafeHTML} from 'lit-html/directives/unsafe-html.js';

export async function render() {
    let elementPaths = Config.get("elementPaths")
    let elementImports: string[] = []
    if (elementPaths) {
        let imports = []
        try {
            imports = JSON.parse(elementPaths)
        } catch (_e) {
            console.error("Improper elementPaths provided")
        }
        if (Array.isArray(imports)) {
            elementImports = elementImports.concat(imports)
        }
    }

    const input = JSON.parse(Host.inputString())

    if (Array.isArray(input.elementPaths)) {
        elementImports = elementImports.concat(input.elementPaths)
    }

    // This won't work because dynamic `import()` isn't supported by Extism.
    await Promise.allSettled(elementImports.map((str) => import(str)))

    const templ = ssrRender(unsafeHTML(input.content))
    const result = await collectResult(templ)
    Host.outputString(result)
}

However, the dynamic runtime import does not work. I don't want people to have to compile the plugin themselves and import their own modules. Is there a better way to do this? IE: using vm or a Worker like how Lit does with 11ty?

https://github.com/lit/lit/blob/main/packages/labs/eleventy-plugin-lit/src/index.ts

Thanks for your help!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions