This plugin generates a self-replicating single-page app (SPA), enabling users to run it entirely offline with zero dependencies.

Installation

npm install html-itself

Usage

main.js

import { getApp, getPayload } from 'html-itself';

// Retrieve the payload embedded in the current page
console.log('Current payload:', getPayload());

document.querySelector('#download-btn').addEventListener('click', () => {
    
    // Payload can be any serializable data
    let newPayload = Date.now();

    // Generate and trigger download of a new HTML file
    let html = getApp(newPayload, 'new-page.html');

    // // Alternatively, just return the HTML string without downloading:
    // const htmlCode = getApp(newPayload);
});

rollup.config.js

import htmlItself from "html-itself/rollup";
import { nodeResolve } from '@rollup/plugin-node-resolve';

export default {
    input: "main.js",
    output: {
        format: 'iife'
    },
    plugins: [
        nodeResolve(),
        htmlItself({
            // To get HTML content before and after <script src="main.js">
            template: () => {
                return [
                    '<!-- HTML content before main.js -->',
                    '<!-- HTML content after main.js -->'
                ];
            },
            target: 'dist/index.html', // Output file path
            payloadInit: '' // Initial payload (can be any serializable value)
        })
    ]
};