Docs / Pages and packages
JavaScript and TypeScript
Each Snippet is written in JavaScript or TypeScript. TypeScript is checked as you type.
A Snippet’s Language decides how its code is read and run. Each tab has its own, so a JavaScript Snippet and a TypeScript one can be open side by side.
Pick a Language
- Click the Language button in the footer, at the right.
- Pick JavaScript (No type checking) or TypeScript (Types are checked as you type).
With Run as you type on, the Snippet runs again at once in its new Language.
- Type aliases can only be used in TypeScript files.
JavaScript runs as JavaScript. Types in a JavaScript Snippet are a syntax error, so nothing runs, and the console says what JavaScript itself would say: Line 1: SyntaxError: Unexpected identifier 'Point'.
A new Snippet is in JavaScript. To start in TypeScript, change Settings → Running → Language for new Snippets. Snippets you already have keep their Language.
A Vue or Svelte Snippet has no Language menu. Its <script lang="ts"> makes it TypeScript, as in a Vue or Svelte project.
JSX and TSX
A React, Preact or Solid Snippet has JSX. There the two Languages are called JSX and TSX, and the script’s tab says the same.
JSpark compiles the JSX for the Snippet’s library: React’s and Preact’s with esbuild, and Solid’s with Solid’s own compiler, so Solid code behaves as it does in a Solid project. A Snippet keeps its library for life, from the Starter it was made from.
Type checking
In a TypeScript Snippet, the editor checks the types as you type:
- A type error is underlined. Hover it to read the error.
- Hover a name to see its type.
- Suggestions come from the types. A Node Snippet has Node’s own types.
- Argument of type 'string' is not assignable to parameter of type 'number'.
At first, a type error doesn’t stop the Run: it is underlined, and the code runs anyway. A JavaScript Snippet has no type checking, only its grammar is checked.
When a type error holds the Run
To stop a TypeScript Snippet from running while it has a type error:
- Open Settings → Running.
- Switch on Don’t run with type errors.
Run the code a moment after you stop typing. Off: only when you press Run (⌘↵). Code that reaches outside — files, network — waits for Run either way.
How long to wait after your last keystroke before running. Shorter feels live; longer runs less often while you think.
Stops code that stays busy this long without a pause, like an endless loop. A server or a timer that waits between events keeps going until you press Stop. In the Timeline, it limits the whole recording.
Stops a run that uses more memory than this, before it slows down your computer. Raise it for large data. In the Timeline, the recording may use up to half of it.
TypeScript
Off: type errors are underlined and the code runs anyway. On: they are printed in the console and nothing runs.
Language for new Snippets
No type checking.
New Snippets run as
Always strict. Uses import, export and top-level await, like a .mjs file. Snippets you already have keep the one they were made with.
Now a Run with a type error runs nothing. The console lists each error with its line, and the footer says Didn’t run. Click an error to go to its line.
- The setting applies to every tab, from its next Run.
- It never holds a JavaScript Snippet, even one with
// @ts-check. - Run as you type keeps running, and shows the errors each time.
For the steps when a Run is waiting on a type error, see My TypeScript did not run because of a type error.
The pictures show JSpark on a Mac. On Windows, the window looks a little different and uses Ctrl for ⌘, but everything works the same way.