<p dir="auto"><code class="notranslate">react.tsx</code>:</p>
<div class="highlight highlight-source-tsx notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="import React from &quot;https://esm.sh/react&quot;

export default function hello(foo: string) {
	return &lt;p&gt; Hello {foo}&lt;/p&gt;;
}

console.log(hello(&quot;world&quot;))"><pre class="notranslate"><span class="pl-k">import</span> <span class="pl-smi">React</span> <span class="pl-k">from</span> <span class="pl-s">"https://esm.sh/react"</span>

<span class="pl-k">export</span> <span class="pl-k">default</span> <span class="pl-k">function</span> <span class="pl-en">hello</span><span class="pl-kos">(</span><span class="pl-s1">foo</span>: <span class="pl-smi">string</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
	<span class="pl-k">return</span> <span class="pl-c1">&lt;</span><span class="pl-ent">p</span><span class="pl-c1">&gt;</span> Hello <span class="pl-kos">{</span><span class="pl-s1">foo</span><span class="pl-kos">}</span><span class="pl-c1">&lt;</span><span class="pl-c1">/</span><span class="pl-ent">p</span><span class="pl-c1">&gt;</span><span class="pl-kos">;</span>
<span class="pl-kos">}</span>

<span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-en">hello</span><span class="pl-kos">(</span><span class="pl-s">"world"</span><span class="pl-kos">)</span><span class="pl-kos">)</span></pre></div>
<p dir="auto"><code class="notranslate">deno run react,tsx</code>:</p>
<div class="highlight highlight-source-shell notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="Check file:///home/luca/testStuff/deno/react.tsx
{
  &quot;$$typeof&quot;: Symbol(react.element),
  type: &quot;p&quot;,
  key: null,
  ref: null,
  props: { children: [ &quot; Hello &quot;, &quot;world&quot; ] },
  _owner: null
}"><pre class="notranslate">Check file:///home/luca/testStuff/deno/react.tsx
{
  <span class="pl-s"><span class="pl-pds">"</span><span class="pl-smi">$$</span>typeof<span class="pl-pds">"</span></span>: Symbol(react.element),
  type: <span class="pl-s"><span class="pl-pds">"</span>p<span class="pl-pds">"</span></span>,
  key: null,
  ref: null,
  props: { children: [ <span class="pl-s"><span class="pl-pds">"</span> Hello <span class="pl-pds">"</span></span>, <span class="pl-s"><span class="pl-pds">"</span>world<span class="pl-pds">"</span></span> ] },
  _owner: null
}</pre></div>
<p dir="auto"><code class="notranslate">deno run - &lt; react.tsx</code>:</p>
<div class="highlight highlight-source-shell notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="deno run - &lt; react.tsx
error: Expected ;, got { at file:///home/luca/testStuff/deno/$deno$stdin.ts:4:21"><pre class="notranslate">deno run - <span class="pl-k">&lt;</span> react.tsx
error: Expected <span class="pl-k">;</span>, got { at file:///home/luca/testStuff/deno/<span class="pl-smi">$deno$stdin</span>.ts:4:21</pre></div>
<p dir="auto">I'm trying out deno for scripting (it's been a great experience so far, kudos!).</p>
<p dir="auto">I'd like to be able to create script files without a <code class="notranslate">.ts</code> extension. If I do this, then the following is interpreted as JS and I get a syntax error on the type annotations:</p>
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="#!/usr/bin/env -S deno run --allow-run --allow-read --allow-write

// code: language=typescript

function hello(name: string) {
  console.log(&quot;Hello,&quot;, name);
}

hello(Deno.args[0]);"><pre class="notranslate">#!/usr/bin/env -S deno run --allow-run --allow-read --allow-write

<span class="pl-c">// code: language=typescript</span>

<span class="pl-k">function</span> <span class="pl-en">hello</span><span class="pl-kos">(</span><span class="pl-s1">name</span>: <span class="pl-smi">string</span><span class="pl-kos">)</span> <span class="pl-kos">{</span>
  <span class="pl-smi">console</span><span class="pl-kos">.</span><span class="pl-en">log</span><span class="pl-kos">(</span><span class="pl-s">"Hello,"</span><span class="pl-kos">,</span> <span class="pl-s1">name</span><span class="pl-kos">)</span><span class="pl-kos">;</span>
<span class="pl-kos">}</span>

<span class="pl-en">hello</span><span class="pl-kos">(</span><span class="pl-smi">Deno</span><span class="pl-kos">.</span><span class="pl-c1">args</span><span class="pl-kos">[</span><span class="pl-c1">0</span><span class="pl-kos">]</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="$  ./myscript 
error: Uncaught SyntaxError: Unexpected token ':'
function hello(name: string) {
                   ^
    at file:///home/joe/tmp/myscript:5:20"><pre class="notranslate"><code class="notranslate">$  ./myscript 
error: Uncaught SyntaxError: Unexpected token ':'
function hello(name: string) {
                   ^
    at file:///home/joe/tmp/myscript:5:20
</code></pre></div>
<p dir="auto">I believe the simplest solution would be to add a CLI flag to force script to be interpreted as typescript.</p>
<p dir="auto">Something like:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="--language=[javascript, typescript]"><pre class="notranslate"><code class="notranslate">--language=[javascript, typescript]
</code></pre></div>
<p dir="auto">so in the above script the shebang becomes:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="#!/usr/bin/env -S deno run --language=typescript --allow-run --allow-read --allow-write"><pre class="notranslate"><code class="notranslate">#!/usr/bin/env -S deno run --language=typescript --allow-run --allow-read --allow-write
</code></pre></div>