Vite React ReScript Starter

The Vite React ReScript Starter is a boilerplate project that merges the official Vite React template with the ReScript language and its React bindings, producing a preconfigured starting point for typed, compiled-to-JavaScript frontend development.

What is the Vite React ReScript Starter?

The starter is a GitHub template maintained by jihchi that wires together Vite, React, ReScript, rescript-react, Vitest, React Testing Library, and Tailwind CSS into one project. Its core function is to let you write React applications in ReScript, a JavaScript-like language with a sound type system, instead of plain JavaScript or TypeScript. The template consumes the official Vite React template and adds ReScript compilation through the @jihchi/vite-plugin-rescript plugin, so you can develop components in ReScript files and get JavaScript output that runs in the browser.

Key Features

• Vite — Next Generation Frontend Tooling; provides fast cold starts and instant hot module replacement during development.
• React — A JavaScript library for building user interfaces; the starter uses react and react-dom as the UI runtime.
• ReScript — A typed language that compiles to clean, readable JavaScript; previously known as BuckleScript and Reason.
• @jihchi/vite-plugin-rescript — Integrates ReScript compilation into Vite's build and dev pipeline.
• Vitest — A fast unit-test framework powered by Vite; used for running tests in this template.
• rescript-vitest — Provides ReScript bindings to Vitest so tests can be written in ReScript.
• React Testing Library — Helps test UI components in a user-centric way, encouraging tests that reflect how users interact with the app.
• Tailwind CSS — A utility-first CSS framework; the template includes Tailwind so you can style components without leaving your markup.

Who is it for?

• ReScript developers who want a ready-made Vite and React environment without spending time on integration.
• React developers curious about ReScript who want to explore a typed alternative to JavaScript with minimal setup.
• Frontend teams adopting a static typing workflow who need a test stack that includes Vitest and React Testing Library from the start.

What can you do with the Vite React ReScript Starter?

• Scaffold a new project by running npx degit jihchi/vitejs-template-react-rescript my-vitejs-react-rescript followed by npm install and npm start.
• Write React components in ReScript and use them within the React app, leveraging the type safety of the language.
• Run unit tests with Vitest using the included rescript-vitest bindings, and test UI components with React Testing Library.
• Style interfaces with Tailwind utility classes that are preinstalled in the template.

How does the starter work?

The setup flow is a three-step process: first, use degit to clone the template into a new folder; second, install dependencies with npm; third, run npm start to launch the Vite dev server. The template includes the ReScript compiler plugin so .res files are compiled automatically as part of the Vite build.

Alternatives

The readme lists rescript-lang/create-rescript-app as a separate alternative for creating ReScript applications, focusing on a different scaffolding approach from this Vite-based template.

FAQ

Is the Vite React ReScript Starter free?

Yes, the template is publicly available on GitHub, and you can use the degit command to clone it for your own projects. The repository does not mention a commercial license, so it can be treated as an open-source starter.

What does the template include?

It includes a Vite + React project configured for ReScript, with Vitest plus rescript-vitest for testing, React Testing Library for component tests, and Tailwind CSS for styling. The integration plugin is @jihchi/vite-plugin-rescript.

How do I update the template after cloning?

Because it is a template, you manage it like any Git repository: pull upstream changes if you kept the remote, or merge manually. The readme does not describe an auto-update mechanism.

Does it work with the latest ReScript version?

The readme points to the current ReScript tooling and the vite-plugin-rescript maintained by jihchi, but it does not pin versions in the visible content, so you should check the repository for the latest dependency versions.

Is there a testing setup included?

Yes, Vitest is configured as the unit-test framework, with rescript-vitest providing ReScript bindings and React Testing Library included for user-centric component testing.