Initial commit: code playground with multi-framework support
Express + SQLite backend with Monaco editor frontend. Supports HTML/CSS/JS, TypeScript, React (JSX/TSX), Vue SFC, and Svelte with live preview, console output, save/fork/share. Includes CSS preprocessors (SCSS, Less), framework-specific compilation (Babel, TypeScript, Svelte compiler), and CDN-loaded runtime libraries for preview rendering.
This commit is contained in:
27
public/js/console-panel.js
Normal file
27
public/js/console-panel.js
Normal file
@@ -0,0 +1,27 @@
|
||||
const output = () => document.getElementById('console-output');
|
||||
|
||||
export function initConsole() {
|
||||
window.addEventListener('message', (e) => {
|
||||
if (!e.data || e.data.type !== 'console') return;
|
||||
if (e.data.method === 'clear') {
|
||||
clearConsole();
|
||||
return;
|
||||
}
|
||||
appendLine(e.data.method, (e.data.args || []).join(' '));
|
||||
});
|
||||
|
||||
document.getElementById('btn-clear-console').addEventListener('click', clearConsole);
|
||||
}
|
||||
|
||||
function appendLine(method, text) {
|
||||
const el = document.createElement('div');
|
||||
el.className = `console-line console-${method}`;
|
||||
el.textContent = text;
|
||||
const out = output();
|
||||
out.appendChild(el);
|
||||
out.scrollTop = out.scrollHeight;
|
||||
}
|
||||
|
||||
export function clearConsole() {
|
||||
output().innerHTML = '';
|
||||
}
|
||||
Reference in New Issue
Block a user