@webcontainer/snapshot
v0.1.0
Published
Build filesystem snapshots for the WebContainer API
Downloads
875
Readme
WebContainer Snapshot Utils
This package exposes utilities to help build filesystem snapshots for usage with the WebContainer API.
How To
This package is meant to be used on the server-side to build a binary snapshot of a given folder.
import { snapshot } from '@webcontainer/snapshot';
const sourceSnapshot = await snapshot(sourceFilesFolder);
// Express-like handler
function getSnapshot(req: Request, res: Resonse) {
res.setHeader('content-type', 'application/octet-stream').send(sourceSnapshot);
}
// SvelteKit-like handler
function getSnapshot(req: Request) {
return new Response(sourceSnapshot, {
headers: {
'content-type': 'application/octet-stream',
},
});
}
This snapshot can later be sent to a WebContainer API-based frontend application.
import { WebContainer } from '@webcontainer/api';
const webcontainer = await WebContainer.boot();
const snapshotResponse = await fetch('/snapshot');
const snapshot = await snapshotResponse.arrayBuffer();
await webcontainer.mount(snapshot);