5 ms·

No, that is not TypeScript. That's TSX. If you don't happen to have react, preact or a similar front end library, and a appropriate bundler, it is invalid TypeS

• IshKebab 5mo ago
  > If you don't happen to have react, preact or a similar front end library, and a appropriate bundler, it is invalid TypeScript. Not true, you can compile it to HTML on the backend or even statically too. It's not a terrible idea; it's actually amazing. One of Typescript's best features. I do agree at first it seems icky (reminds me of Qt's MOC) but in practice it's fantastic. I recommend you try it before criticising. Python has nothing close (nor do any other languages tbf).
  • ElectricalUnion 5mo ago
    > It's not a terrible idea; it's actually amazing. You got it wrong, the terrible idea is `pyxy-org/pyxy` >> invalid TypeScript. > If you don't happen to have react, preact or a similar front end library, and a appropriate bundler, it is invalid TypeScript. > Not true, you can compile it to HTML on the backend or even statically too. I had to test your assertion that it compiles to HTML. I remember it being very invalid typescript without react scafolding. So I tested it without the react scafolding: # mise use node@24 # echo '{}' >package.json # npm i --save typescript # echo 'function Greeting({ name }: { name: string }) { return ( <div class="card"> <h1>Hello, {name}!</h1> <p>Welcome to my site.</p> </div> ); } ' >hello.tsx # : a test to check if we have a working typescript compiler # tsc hello.tsx error TS5112: tsconfig.json is present but will not be loaded if files are specified on commandline. Use '--ignoreConfig' to skip this error. # echo '{"compilerOptions":{"jsx":"react"}}' >tsconfig.json # tsc hello.tsx:1:58 - error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists. 1 function Greeting({ name }: { name: string }) { return ( <div class="card"> <h1>Hello, {name}!</h1> <p>Welcome to my site.</p> </div> ); } ~~~~~~~~~~~~~~~~~~ hello.tsx:1:59 - error TS2874: This JSX tag requires 'React' to be in scope, but it could not be found. 1 function Greeting({ name }: { name: string }) { return ( <div class="card"> <h1>Hello, {name}!</h1> <p>Welcome to my site.</p> </div> ); } ~~~ hello.tsx:1:77 - error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists. 1 function Greeting({ name }: { name: string }) { return ( <div class="card"> <h1>Hello, {name}!</h1> <p>Welcome to my site.</p> </div> ); } ~~~~ hello.tsx:1:78 - error TS2874: This JSX tag requires 'React' to be in scope, but it could not be found. 1 function Greeting({ name }: { name: string }) { return ( <div class="card"> <h1>Hello, {name}!</h1> <p>Welcome to my site.</p> </div> ); } ~~ hello.tsx:1:95 - error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists. 1 function Greeting({ name }: { name: string }) { return ( <div class="card"> <h1>Hello, {name}!</h1> <p>Welcome to my site.</p> </div> ); } ~~~~~ hello.tsx:1:101 - error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists. 1 function Greeting({ name }: { name: string }) { return ( <div class="card"> <h1>Hello, {name}!</h1> <p>Welcome to my site.</p> </div> ); } ~~~ hello.tsx:1:102 - error TS2874: This JSX tag requires 'React' to be in scope, but it could not be found. 1 function Greeting({ name }: { name: string }) { return ( <div class="card"> <h1>Hello, {name}!</h1> <p>Welcome to my site.</p> </div> ); } ~ hello.tsx:1:123 - error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists. 1 function Greeting({ name }: { name: string }) { return ( <div class="card"> <h1>Hello, {name}!</h1> <p>Welcome to my site.</p> </div> ); } ~~~~ hello.tsx:1:128 - error TS7026: JSX element implicitly has type 'any' because no interface 'JSX.IntrinsicElements' exists. 1 function Greeting({ name }: { name: string }) { return ( <div class="card"> <h1>Hello, {name}!</h1> <p>Welcome to my site.</p> </div> ); } ~~~~~~ Found 9 errors in the same file, starting at: hello.tsx:1 # cat hello.js function Greeting({ name }) { return (React.createElement("div", { class: "card" }, " ", React.createElement("h1", null, "Hello, ", name, "!"), " ", React.createElement("p", null, "Welcome to my site."), " ")); } # : sanity check # mise use deno # deno hello.tsx # : no output # echo 'function Greeting({ name }: { name: string }) { return ( <div class="card"> <h1>Hello, {name}!</h1> <p>Welcome to my site.</p> </div> ); }; Greeting({ name: "world!" });' >hello2.tsx # deno hello2.tsx error: Uncaught (in promise) ReferenceError: React is not defined at Greeting (file:////hellotsx/hello.tsx:1:49) at file:////hellotsx/hello.tsx:1:141 Where is my static HTML? Oh, that requires react I guess.