esbuild TSX

package.json

@@ -7,7 +7,7 @@
   "license": "MIT",
   "scripts": {
     "build": "cp src/index.html dist/ && yarn esbuild src/index.tsx --outdir=dist --platform=browser --bundle --format=esm",
-    "serve": "cp src/index.html dist/ && yarn esbuild src/index.tsx --outdir=dist --platform=browser --bundle --format=esm --servedir=dist"
+    "serve": "cp src/index.html dist/ && yarn esbuild src/index.tsx --outdir=dist --platform=browser --bundle --format=esm --jsx-factory=createElement --jsx-fragment=Fragment --servedir=dist"
   },
   "devDependencies": {
     "esbuild": "^0.17.18"

src/App.tsx

@@ -0,0 +1,13 @@
+import { React } from "./React";
+
+export function App({ numberOfTicks=5 }){
+  return (
+    <>
+    <div class="header">
+      <h1>Choose Probabilities</h1>
+      <h5>X-Axis = Ticks, Y-Axis = Underlying Price</h5>
+    </div>
+    <div class="chart"></div>
+    </>
+  );
+}

src/React.tsx

@@ -0,0 +1,4 @@
+import { createElement } from "inferno-create-element";
+import { Fragment } from "inferno";
+
+export const React = {createElement, Fragment};

src/index.tsx

@@ -1,11 +1,6 @@
 import { render } from "inferno";
-import { createElement } from "inferno-create-element";
-const React = {createElement};
+import { App } from "./App";
+import { React } from "./React";
 
-function App(){
-  return (
-    <h1>Hello Binomial</h1>
-  );
-}
 
 render(<App />, document.getElementById("app"));