@rawscript/runtime

TypeScript in the browser. No build step. No terminal.

<script src="https://unpkg.com/@rawscript/runtime"></script>
<script type="module" src="./main.ts"></script>

That is the entire setup. main.ts can use TypeScript syntax, import from npm, and use JSX.

How it works

rawscript registers a Service Worker that intercepts every .ts and .tsx request before it reaches the browser's module loader. The SW fetches the raw source, compiles it in-browser with esbuild-wasm, rewrites bare specifiers to esm.sh URLs, and returns application/javascript. From the browser's perspective it requested a .js file and has no idea TypeScript was involved.

The esbuild WASM binary (~8MB) is pre-cached on the SW install event. After the first load, compilation is instant.

Importing npm packages

Bare specifiers are rewritten to esm.sh automatically — no import map required.

import React, { useState } from 'react'
import { createRoot } from 'react-dom/client'

Pin a version with import React from '[email protected]'.

This package is a development runtime

For production, build a static bundle with no rawscript in it:

npm i -D @rawscript/cli
npx rawscript build

See @rawscript/cli.

Zero dependencies

No runtime dependencies. Ships two files: dist/rawscript.js (page boot script) and dist/rawscript-sw.js (Service Worker).

Documentation

Full docs, security model, browser support matrix, and benchmarks: https://github.com/rawscriptdev/rawscript

MIT © rawscript contributors