56 lines
1.2 KiB
JavaScript
56 lines
1.2 KiB
JavaScript
import { context } from 'esbuild';
|
|
import { resolve } from 'path';
|
|
import { fileURLToPath } from 'url';
|
|
import { EDIT_MODE_STYLES } from './ui/inline-edit/styles.js';
|
|
|
|
const __filename = fileURLToPath(import.meta.url);
|
|
const __dirname = resolve(__filename, '..');
|
|
|
|
/**
|
|
* Bundles the multi-file contenteditable edit-mode runtime with esbuild and
|
|
* injects it (plus the edit-mode styles) into the dev preview HTML.
|
|
*
|
|
* @returns {import('vite').Plugin}
|
|
*/
|
|
export default function inlineEditDevPlugin() {
|
|
let buildContext = null;
|
|
|
|
return {
|
|
name: 'vite:inline-edit-dev',
|
|
apply: 'serve',
|
|
|
|
async buildStart() {
|
|
buildContext = await context({
|
|
entryPoints: [resolve(__dirname, 'edit-mode-script.js')],
|
|
bundle: true,
|
|
format: 'esm',
|
|
sourcemap: 'inline',
|
|
write: false,
|
|
platform: 'browser',
|
|
target: 'es2020',
|
|
});
|
|
},
|
|
|
|
async transformIndexHtml() {
|
|
const { outputFiles } = await buildContext.rebuild();
|
|
return [
|
|
{
|
|
tag: 'script',
|
|
attrs: { type: 'module' },
|
|
children: outputFiles[0].text,
|
|
injectTo: 'body',
|
|
},
|
|
{
|
|
tag: 'style',
|
|
children: EDIT_MODE_STYLES,
|
|
injectTo: 'head',
|
|
},
|
|
];
|
|
},
|
|
|
|
closeBundle() {
|
|
buildContext?.dispose();
|
|
},
|
|
};
|
|
}
|