<p dir="auto">Deno claims to be a "secure runtime for JavaScript and TYPESCRIPT", and it is one of the main reasons why I started looking into Deno.</p>
<p dir="auto">And yet, a simple test on <code class="notranslate">deno repl</code> shows that the typescript is not really supported. Is this by design? Is this Deno's technical limitations?</p>
<p dir="auto">For me, personally, being able to transpile Typescript to Javascript has relatively low value. Whether I compile the code via tsc or deno (with embedded tsc), or any other tools, has very little difference. It's just a build process.</p>
<p dir="auto">The real value for me (if Deno supports Typescript as a first class citizen, as it seems to promise) will be being able to "hide" the transpilation process from the user experience, like in REPL.</p>
<p dir="auto">PR <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="370451551" data-permission-text="Title is private" data-url="https://github.com/denoland/deno/issues/998" data-hovercard-type="pull_request" data-hovercard-url="/denoland/deno/pull/998/hovercard" href="https://github.com/denoland/deno/pull/998">#998</a> provides a REPL for Deno, but only supports plain JavaScript.  It needs to support TypeScript as well.</p>
<p dir="auto">I was thinking about the approach and am writing up a couple ideas.  <a href="https://github.com/TypeStrong/ts-node">ts-node</a> provides a REPL and in looking at how they accomplish it seems like a reasonably logical approach to attempt with Deno.  In order to support that, I think we need to do the following:</p>
<ul dir="auto">
<li>Create a Deno Compiler API that takes in a source code and optionally previous output code, returning any new lines and any diagnostics.  Maybe something like this:
<div class="highlight highlight-source-ts notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="incrementalCompile(sourceCode: SourceCode, previousOutput?: OutputCode): { diagnostics: ts.Diagnostic[], outputCode: OutputCode, additionalCode: OutputCode);"><pre class="notranslate"><span class="pl-en">incrementalCompile</span><span class="pl-kos">(</span><span class="pl-s1">sourceCode</span>: <span class="pl-smi">SourceCode</span><span class="pl-kos">,</span> <span class="pl-s1">previousOutput</span>?: <span class="pl-smi">OutputCode</span><span class="pl-kos">)</span>: <span class="pl-kos">{</span> <span class="pl-c1">diagnostics</span>: <span class="pl-s1">ts</span><span class="pl-kos">.</span><span class="pl-c1">Diagnostic</span><span class="pl-kos">[</span><span class="pl-s1"></span><span class="pl-kos">]</span><span class="pl-kos">,</span> <span class="pl-s1">outputCode</span>: <span class="pl-smi">OutputCode</span><span class="pl-kos">,</span> <span class="pl-c1">additionalCode</span>: <span class="pl-smi">OutputCode</span><span class="pl-kos">)</span><span class="pl-kos">;</span></pre></div>
Note that the <code class="notranslate">compiler.configure()</code> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="376201025" data-permission-text="Title is private" data-url="https://github.com/denoland/deno/issues/1136" data-hovercard-type="pull_request" data-hovercard-url="/denoland/deno/pull/1136/hovercard" href="https://github.com/denoland/deno/pull/1136">#1136</a> will likely be need as well to allow the REPL to change the configuration, which it will need to do.  We might have to modify it so it actually allows some changes that we wouldn't normally allow.</li>
<li>The REPL keeps the "context" of the source code, appending lines to this context, and compiling the code incrementally.</li>
<li>The REPL then evals the incremental lines, (but not the full output code) or outputs diagnostics.</li>
</ul>
<p dir="auto">The reason it needs to work this way, is that in some cases, the TypeScript will output something higher up (like when it emits helpers) and those need to be evaled.</p>
<p dir="auto">Things like imports and async are going to be complex, I would recommend we aim for an MVP and then figure out how to go from there.</p>
<p dir="auto">cc: <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/bartlomieju/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/bartlomieju">@bartlomieju</a></p>