This is the latest docs version
Quick Links
  • -Overview
  • -Language Features
  • -JS Interop
  • -Build System
Documentation
Language Manual
Reference for all language features
ReScript & React
First class bindings for ReactJS
GenType
Seamless TypeScript integration
Reanalyze
Dead Code & Termination analysis
Exploration
Packages
Explore third party libraries and bindings
Syntax Lookup
Discover all syntax constructs
APIPlaygroundBlogCommunity
  • Playground
  • Blog
  • X
  • Bluesky
  • GitHub
  • Forum
Language Manual
Overview
  • Introduction
  • Installation
    • Notes
    • Prerequisites
    • New Project
    • Integrate Into an Existing JS Project
  • Migrate to v11
  • Editor Plugins
  • Try
Language Features
  • Overview
  • Let Binding
  • Type
  • Primitive Types
  • Tuple
  • Record
  • Object
  • Variant
  • Polymorphic Variant
  • Null, Undefined and Option
  • Array & List
  • Function
  • If-Else & Loops
  • Pipe
  • Pattern Matching / Destructuring
  • Mutation
  • JSX
  • Exception
  • Lazy Value
  • Promises
  • Async / Await
  • Tagged templates
  • Module
  • Import & Export
  • Attribute (Decorator)
  • Reserved Keywords
  • Equality and Comparison
Advanced Features
  • Extensible Variant
  • Scoped Polymorphic Types
  • Module Functions
JavaScript Interop
  • Interop Cheatsheet
  • Embed Raw JavaScript
  • Shared Data Types
  • External (Bind to Any JS Library)
  • Bind to JS Object
  • Bind to JS Function
  • Import from / Export to JS
  • Bind to Global JS Values
  • JSON
  • Inlining Constants
  • Use Illegal Identifier Names
  • Generate Converters & Helpers
  • Browser Support & Polyfills
  • Libraries & Publishing
  • TypeScript
Build System
  • Overview
  • Configuration
  • Configuration Schema
  • External Stdlib
  • Pinned Dependencies
  • Interop with JS Build Systems
  • Performance
  • Warning Numbers
Guides
  • Converting from JS
Extra
  • Newcomer Examples
  • Project Structure
  • FAQ
Docs / Language Manual / Installation
Edit

Installation

Notes

With the instructions below, our new standard library ReScript Core will be included by default. (In ReScript 11, it comes as a separate npm package @rescript/core. In future versions, it will be included in the rescript npm package itself.)

Prerequisites

  • Node.js version >= 14

  • One of the following package managers:

    • npm (comes with Node.js)

    • yarn (yarn versions >1 need to set nodeLinker: node-modules in .yarnrc.yml)

    • pnpm

    • bun

New Project

The fastest and easiest way to spin up a new ReScript project is with the create-rescript-app project generator. You can start it with any of the aforementioned package managers or npx.

npmnpxyarnpnpmbun
npm create rescript-app@latest
  • Follow the steps of the setup.

  • Trigger a ReScript build:

    SH
    npm run res:build

  • If you selected the "basic" template, simply run it with:

    SH
    node src/Demo.res.js

That compiles your ReScript into JavaScript, then uses Node.js to run said JavaScript.

When taking your first steps with ReScript, we recommend you use our unique workflow of keeping a tab open for the generated JS file (.res.js/.res.mjs), so that you can learn how ReScript transforms into JavaScript. Not many languages output clean JavaScript code you can inspect and learn from! With our VS Code extension, use the command "ReScript: Open the compiled JS file for this implementation file" to open the generated JS file for the currently active ReScript source file.

During development, instead of running npm run res:build each time to compile, use npm run res:dev to start a watcher that recompiles automatically after file changes.

Integrate Into an Existing JS Project

If you already have a JavaScript project into which you'd like to add ReScript you can do that in the following ways:

Quick Setup

In the root directory of your project, execute:

npmnpxyarnpnpmbun
npm create rescript-app@latest

create-rescript-app will tell you that a package.json file has been detected and ask you if it should install ReScript into your project. Just follow the steps accordingly.

Manual Setup

  • Install ReScript locally:

    npmyarnpnpmbun
    npm install rescript @rescript/core
    

  • Create a ReScript build configuration file (called rescript.json) at the root:

    JSON
    { "name": "your-project-name", "sources": [ { "dir": "src", // update this to wherever you're putting ReScript files "subdirs": true } ], "package-specs": [ { "module": "esmodule", "in-source": true } ], "suffix": ".res.js", "bs-dependencies": [ "@rescript/core" ], "bsc-flags": [ "-open RescriptCore" ] }

    See Build Configuration for more details on rescript.json.

  • Add convenience npm scripts to package.json:

    JSON
    "scripts": { "res:build": "rescript", "res:dev": "rescript -w" }

Since ReScript compiles to clean readable JS files, the rest of your existing toolchain (e.g. Babel and Webpack) should just work!

Helpful guides:

  • Converting from JS.

  • Shared Data Types.

  • Import from/Export to JS.

Integrate with a ReactJS Project

To start a rescript-react app, or to integrate ReScript into an existing ReactJS app, follow the instructions here.

IntroductionMigrate to v11

© 2024 The ReScript Project

Software and assets distribution powered by KeyCDN.

About
  • Community
  • ReScript Association
Find us on