babel typescript and flow demo

            
            <div id="output"></div>
<!-- Load Babel -->
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
<!-- Your custom script here -->
<script>
    console.log(Babel.availablePresets)

    // Babel.registerPreset('tsx', {
    //   presets: [
    //     [Babel.availablePresets['typescript'], {allExtensions: true, isTSX: true}]],
    //   },
    // );

    var input = 'const getMessage = (str: string) => <div>123132</div>;';
    var output = Babel.transform(input, {
        presets: [
            "env",
            ['typescript', {
                allExtensions: true,
                isTSX: true
            }],
            "react"
        ]
    }).code;

    console.log(output)


    var input2 = `
function foo(x: ?number): string {
  if (x) {
    return <div>{x}</div>;           
  }
  return "default string";
}
`;
    var output2 = Babel.transform(input2, {
        presets: [
            "env",
            // ['typescript', {allExtensions: true, isTSX: true}],
            'flow',
            "react"
        ]
    }).code;

    console.log(output2)
</script>