Skip to content

Instantly share code, notes, and snippets.

@Zeryther
Created January 28, 2022 11:54
Show Gist options
  • Save Zeryther/72dda6e0bc8ea1573659b6fc93cebca5 to your computer and use it in GitHub Desktop.
Save Zeryther/72dda6e0bc8ea1573659b6fc93cebca5 to your computer and use it in GitHub Desktop.
JSX without react

Code snippets to use JSX without React

declare module JSX {
type Element = string;
interface IntrinsicElements {
[elemName: string]: any;
}
}
import "./JSX";
console.log("Hello world");
class JSXService {
public createElement(tag: string, attrs: any, children: any): HTMLElement {
var element: HTMLElement = document.createElement(tag);
for (let name in attrs) {
if (name && attrs.hasOwnProperty(name)) {
var value: string | null | boolean = attrs[name];
if (value === true) {
element.setAttribute(name, name);
} else if (value !== false && value != null) {
element.setAttribute(name, value.toString());
}
}
}
for (let i: number = 2; i < arguments.length; i++) {
let child: any = arguments[i];
element.appendChild(
child.nodeType == null ?
document.createTextNode(child.toString()) : child);
}
return element;
}
}
var JSX: JSXService = new JSXService();
window["JSX"] = JSX;
{
"compilerOptions": {
"jsx": "react",
"jsxFactory": "JSX.createElement"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment