How to Transpile TypeScript On-the-Fly in Serverless Functions with esbuild.do

Serverless architectures, using platforms like AWS Lambda or Vercel Edge Functions, offer incredible scalability and cost-efficiency. But they also introduce a unique challenge: how do you manage build steps? If your function needs to process, transpile, or bundle code on the fly, you're often faced with a difficult choice. Do you bundle heavy build tools like tsc or esbuild into your deployment package, bloating its size and slowing down cold starts? Or do you build a complex container image just to have the right environment?

What if you could skip all that? Imagine accessing the blazing speed of esbuild through a simple, lightweight API call, directly from your serverless function.

This is exactly what esbuild.do enables. In this step-by-step tutorial, we'll show you how to use our esbuild API to transpile TypeScript code dynamically within a serverless environment, completely eliminating the need for a local Node.js toolchain.

The Serverless Challenge: Why Local Build Tools Fall Short

Traditionally, if you want to run a build tool, you install it via npm and run it from your terminal or a CI/CD pipeline. This model breaks down in a serverless context, especially for on-the-fly processing:

• Bloated Deployments: Including the esbuild binary and its node_modules can add dozens of megabytes to your function's package size.
• Increased Cold Starts: Larger packages take longer for the serverless platform to download and initialize, leading to slower responses for the first request.
• Environment Constraints: Some modern runtimes, like Vercel Edge Functions or Cloudflare Workers, run in a restricted environment that doesn't allow you to execute native binaries. You simply can't run the esbuild CLI directly.
• Configuration Hell: Managing versions, dependencies, and execution permissions in a minimal Linux environment can be frustrating and error-prone.

Enter esbuild.do: Blazing-Fast Bundling as an API

esbuild.do provides esbuild's powerful bundling, transpilation, and minification capabilities as a simple and robust API. It's esbuild as a Service, designed to abstract away all the complexity.

Instead of installing and managing the toolchain, you make a simple API call.

• Zero Dependencies: Your serverless function only needs a lightweight SDK to make an HTTP request. No binaries, no node_modules bloat.
• Incredible Speed: You get the full power of esbuild's Go-based performance without any of the setup overhead.
• Universally Compatible: Since it's just an API, it works in any environment that can make an HTTP request—from AWS Lambda and Google Cloud Functions to Vercel Edge and beyond.
• Effortless Integration: Bundle, minify, and transpile JavaScript, TypeScript, and CSS assets with a consistent and simple agentic workflow.

Step-by-Step Tutorial: Transpiling TypeScript in a Serverless Function

Let's build a practical example: a serverless API endpoint that accepts raw TypeScript code in a request and returns the transpiled, minified JavaScript. This is a common pattern for online code playgrounds, documentation sites, or dynamic plugin systems.

Step 1: Install the SDK

First, add the agentic SDK to your project. This helper library makes communicating with the esbuild.do agent seamless.

npm install @do-business/sdk

Step 2: Create the Serverless Function

We'll create an API route. This example uses the Vercel/Next.js file structure (/api/transpile.ts), but the logic is easily adaptable to any serverless provider.

The function will:

1. Expect a POST request containing a JSON body like { "source": "const fn = (name: string) => ..." }.
2. Instantiate the esbuild.do agent.
3. Call the bundle method, passing the source code.
4. Return the resulting JavaScript.

Here's the full code for our serverless function:

// /api/transpile.ts

import { Agent } from '@do-business/sdk';
import type { NextApiRequest, NextApiResponse } from 'next';

// Instantiate the agent for esbuild.do
// This can be done once outside the handler for reuse.
const esbuild = new Agent('esbuild.do');

export default async function handler(
  req: NextApiRequest,
  res: NextApiResponse
) {
  if (req.method !== 'POST') {
    res.setHeader('Allow', 'POST');
    return res.status(405).end('Method Not Allowed');
  }

  const { sourceCode } = req.body;

  if (!sourceCode || typeof sourceCode !== 'string') {
    return res.status(400).json({ error: 'Missing or invalid sourceCode in request body.' });
  }

  try {
    // 🔥 The magic happens here!
    // We call the esbuild.do agent to process our code.
    const { code } = await esbuild.bundle({
      entryPoints: ['index.ts'],
      sources: {
        // We create a "virtual" file system for esbuild to use.
        'index.ts': sourceCode
      },
      bundle: true,        // Bundle imports into a single file
      minify: true,        // Minify the output
      platform: 'browser', // Target the browser environment
      target: 'es2020',     // Transpile to modern JavaScript
      format: 'iife'       // Immediately-invoked function expression
    });

    // Send the transpiled JavaScript back to the client.
    res.setHeader('Content-Type', 'application/javascript');
    res.status(200).send(code);

  } catch (error) {
    console.error('esbuild.do failed:', error);
    res.status(500).json({ error: 'Failed to transpile code.' });
  }
}

Step 3: Deploy and Test

Deploy your serverless function. Now you can send a POST request to your new endpoint:

curl -X POST https://your-app.vercel.app/api/transpile \
  -H "Content-Type: application/json" \
  -d '{
    "sourceCode": "const greet = (name: string): string => `Hello, ${name}!`; console.log(greet(\"World\"));"
  }'

Response:

You'll receive back the fully transpiled and minified JavaScript, ready to be executed in a browser.

// Resulting bundled and minified code
(()=>{"use strict";console.log("Hello, World!");})();

That's it! You have a powerful, on-demand TypeScript transpilation service running in a minimal serverless function, with zero build tool dependencies.

Frequently Asked Questions (FAQ)

Q: Why use an API for esbuild instead of the CLI?

A: Using esbuild.do abstracts away the complexity of managing binary dependencies, versions, and build environments. It's perfect for serverless functions, CI/CD pipelines, online playgrounds, and any environment where installing Node.js and npm packages is inconvenient or impossible.

Q: What languages and formats does esbuild.do support?

A: Just like the underlying tool, our agent supports JavaScript (JS, JSX) and TypeScript (TS, TSX). It can also bundle CSS, load JSON files, and handle various output formats like IIFE, CommonJS (CJS), and ES Modules (ESM).

Q: How does the sources map work?

A: You provide an object where keys are filenames and values are the file content as strings. Our agent creates a virtual file system to process these files, resolves imports between them, and returns the final bundled code. This allows you to bundle multiple in-memory files without ever writing to disk.

Simplify Your Serverless Workflow Today

By leveraging esbuild.do, you can offload complex build steps to a dedicated, high-speed service. This keeps your serverless functions lean, fast, and easy to manage. You no longer have to worry about packaging binaries or slow cold starts caused by bloated dependencies.

Ready to simplify your serverless builds? Get started with esbuild.do and experience the power of esbuild as a service.