Skip to content
🎉 Free Pascal v3.2.4 is out! See Release Notes
Pas2js

Pas2js

Pas2js is an open-source transpiler developed by the Free Pascal team that translates Object Pascal source code directly into optimized JavaScript.

It allows software developers to use the strict typing, structured syntax, and object-oriented features of Pascal to build modern web applications, client-side scripts, and Node.js applications that run natively in any web browser or runtime environment.

Key Elements

  • Browser DOM Access: It provides native Pascal bindings for the HTML DOM, browser APIs, and window events.
  • Lazarus IDE Support: It integrates into the Lazarus IDE, allowing you to design web user interfaces visually.
  • Smart Linking: It strips out unused code during compilation to keep the generated JavaScript file sizes exceptionally small and fast.

Quick Start Guide

This guide covers setting up the command-line compiler and building your first web application.

Installation & Setup

Download Pas2js

Download the official releases of the pas2js transpiler here.

Extract the Files

Place the compiler executable (pas2js) into a dedicated directory (e.g., C:\pas2js\ or /usr/local/bin/).

Update Environment Path

Add the installation directory to your system’s PATH variable to run the compiler from any terminal.

Create Your First Project

Create a new directory for your project and add the following two files.

  1. index.html file acts as the host environment for your compiled script.
index.html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>pas2js quick start</title>
    <script src="app.js"></script>
  </head>
  <body>
    <button id="myButton">click me</button>
    <p id="output"></p>
    <script>
      rtl.run();
    </script>
  </body>
</html>
  1. app.pas is your Pascal source code interacting directly with the browser’s Document Object Model (DOM).
app.pas
program app;

{mode objfpc}{$H+}

uses
 web;

function HandleButtonClick(Event: TJSEvent) : boolean;
var
  OutputData: TJSElement;
begin
  OutputData := document.getElementById('output');
  if (OutputData <> nil) then
    OutputData.innerHTML := 'Hello from pas2js!';
end;

var
  Button: TJSElement;
begin
  window.onload := function(Event: TJSEvent) : boolean
    begin
      Button := document.getElementById('myButton');
      if Button <> nil then
        Button.addEventListener('click', @HandleButtonClick);
    end;
end.

Compile and Run

Open your terminal or command prompt inside your project directory.

Run the compiler command to target the browser environment:

pas2js -Tbrowser app.pas -Jirtl.js

This command compiles an Object Pascal program (app.pas) into JavaScript optimized for web browsers. It generates an optimized app.js file in the same directory.

-Jirtl.js instructs the compiler to insert (-Ji) the Pascal Run-Time Library (rtl.js) file directly into the top of the compiled JavaScript file.

Open index.html in any modern web browser and click the button to see it run!

For detailed information of Pas2js, consult the Pas2js WiKi documentation.