script.js

#!/usr/bin/env node
const fs = require('fs');

// Configuration
const APP_JS_FILE = 'drawExample.js'; // scichart config of your chart
const OUTPUT_FILE = 'output.html';
const SCICHART_JS = 'node_modules/scichart/index.min.js';
const SCICHART_WASM = `node_modules/scichart/_wasm/scichart${process.argv[2]}.wasm`; // both 2d and 3d

console.log('📦 Bundling SciChart into single HTML file...\n');

let appJs, sciChartJs, wasmBase64;

try {
    appJs = fs.readFileSync(APP_JS_FILE, 'utf8');
    console.log(`✓ Read application code from: ${APP_JS_FILE}`);
} catch (err) {
    console.error(`✗ Error reading ${APP_JS_FILE}:`, err.message);
    process.exit(1);
}

try {
    sciChartJs = fs.readFileSync(SCICHART_JS, 'utf8');
    console.log(`✓ Read SciChart library from: ${SCICHART_JS}`);
} catch (err) {
    console.error(`✗ Error reading ${SCICHART_JS}:`, err.message);
    process.exit(1);
}

try {
    const wasmBuffer = fs.readFileSync(SCICHART_WASM);
    wasmBase64 = wasmBuffer.toString('base64');
    console.log(`✓ Read and encoded WASM from: ${SCICHART_WASM}`);
    console.log(`  WASM size: ${(wasmBuffer.length / 1024).toFixed(2)} KB`);
    console.log(`  Base64 size: ${(wasmBase64.length / 1024).toFixed(2)} KB`);
} catch (err) {
    console.error(`✗ Error reading ${SCICHART_WASM}:`, err.message);
    process.exit(1);
}

// HTML template
const htmlTemplate = `<!DOCTYPE html>
<html lang="en" style="height:100%">
<head>
    <title>SciChartJS Offline Demo</title>
    <style>
        body {
            width: 100vw;
            height: 100vh;
            padding: 10px;
            background-color: #242424;
        }
        #scichart-root {
            width: 100%;
            height: 100%;
        }
        * {
            box-sizing: border-box;
            margin: 0;
        }
    </style>
    <script>
    // index.min.js
    ${sciChartJs}
    </script>
    <script>
        // WASM loader
        (function() {
        const wasmBase64 = "${wasmBase64}";
        const originalFetch = window.fetch;
        window.fetch = function(url, options) {
            if (url.endsWith('.wasm') || url.includes('scichart')) {
            const binaryString = atob(wasmBase64);
            const bytes = new Uint8Array(binaryString.length);
            for (let i = 0; i < binaryString.length; i++) {
                bytes[i] = binaryString.charCodeAt(i);
            }
            return Promise.resolve(new Response(bytes, {
                status: 200,
                headers: { 'Content-Type': 'application/wasm' }
            }));
            }
            return originalFetch.call(this, url, options);
        };
        })();
    </script>
</head>
<body>
    <div id="scichart-root"></div>
    <script defer>
        ${appJs}
    </script>
</body>
</html>`;

// Write output file
try {
    fs.writeFileSync(OUTPUT_FILE, htmlTemplate);
    const outputSize = fs.statSync(OUTPUT_FILE).size;
    console.log(`\n✓ Successfully created: ${OUTPUT_FILE}`);
    console.log(`  Total size: ${(outputSize / 1024 / 1024).toFixed(2)} MB`);
    console.log(`\n🎉 Done! Open ${OUTPUT_FILE} in your browser.`);
} catch (err) {
    console.error(`✗ Error writing ${OUTPUT_FILE}:`, err.message);
    process.exit(1);
}