@alloc/html-bundle
Version:
Bundle your HTML assets with Esbuild and LightningCSS. Custom plugins, HMR platform, and more.
45 lines • 1.79 kB
JavaScript
import { buildRelativeScripts } from '../esbuild.mjs';
import { baseRelative } from '../utils.mjs';
export const liveScriptsPlugin = config => {
const cache = {};
const documents = {};
return {
document(_root, file, { scripts }) {
documents[file] = scripts;
for (const script of scripts) {
if (!script.isModule) {
continue; // Only module scripts can be refreshed.
}
script.srcAttr.value = new URL(script.srcAttr.value, config.server.url).href;
}
},
hmr(clients) {
return {
// FIXME: We should only accept files that we know are used in
// bundled entry scripts with the type="module" attribute, as
// those are the only scripts we can update without reloading
// the extension.
accept: file => /\.m?[tj]sx?$/.test(file),
async update() {
for (const scripts of Object.values(documents)) {
const { outputFiles } = await buildRelativeScripts(scripts, config, { watch: true, write: false });
for (const file of outputFiles) {
const id = baseRelative(file.path);
cache[id] = Buffer.from(file.contents);
}
clients.forEach(client => client.reload());
}
},
};
},
serve(req) {
if (req.pathname) {
const data = cache[req.pathname];
if (data) {
return { data };
}
}
},
};
};
//# sourceMappingURL=liveScripts.mjs.map