NOTE: this extension is currently unmaintained.
If you're on our default workflow, please try this plugin instead. Thanks!
vscode-reasonml
Reason support for Visual Studio Code
Discussion
There is an #editorsupport
channel on the Reason discord server. If you would like to discuss an idea or need help or have other feedback you can usually find me (@freebroccolo) idling there.
Features
-
highlighting
- advanced syntax highlighting for reason
- basic highlighting for merlin, ocamlbuild, and opam files
-
editing
- document formatting (enable on save with
editor.formatOnSave
) - completion and snippets
- rename symbol (F2 or right click)
- case splitting
- document formatting (enable on save with
-
navigation
- symbol outline for buffers (โงโO) (type
:
in list to sort items) - symbol outline for project (โT) (supports regular expressions)
- jump-to-definition (โ+click) and code preview (โ+hover)
- find references (โงF12 or right click)
- symbol outline for buffers (โงโO) (type
-
static analysis
- merlin integration with incremental edit synchronization
- display types over definitions (disable with
editor.codeLens
setting) - display types and markdown-rendered docs on hover
- online linting and compiler diagnostics with suggested fixes
- โงโM to toggle diagnostics panel
- F8 to loop through diagnostics for current file
- Click on lightbulb icon for suggested fixes
- built-in support for showing BuckleScript's bsb errors inline, as a companion to merlin's diagnosis.
Getting Started
Recommended Syntax Themes
Although syntax highlighting should display well in most themes we recommend and test with the following:
Default Themes
- Dark+ (recommended; this theme is the most thoroughly tested)
Other Themes
Configurations
Reason
The Reason installation steps also installs Merlin for you, so you can skip the Merlin installation in the next section.
Merlin
Configured for you already if you've installed Reason above & plan to use it for JS compilation. Skip this step.
This extension relies heavily on merlin so you will
need to have your project set up for that in order to enable completion and hover info. See the
Merlin wiki for details on
how to do that. Basically you need to have a .merlin
file in your project root which lists the
source directories, libraries, and extensions used.
Bsb
You can optionally start bsb from the editor itself, and have the command-line errors appear inside the editor. Add the following to Code > Preferences > Settings
:
"reason.diagnostics.tools": [
"merlin",
"bsb"
]
Merlin's diagnosis is best-effort and can sometimes be wrong; bsb's diagnosis is 100% correct. bsb diagnosis also works on Windows.
Installation
Note: due to an existing problem, make sure that you're opening vscode from the command-line, at the root of your project!
Install this Visual Studio Code extension just like any other extension.
Search for reason
and install OCaml and Reason IDE
by Darin Morrison
.
To enable formatting on save, add the following to Code > Preferences > Settings
:
{
"editor.formatOnSave": true
}
If you want to enable codelens, add the following to Code > Preferences > Settings
:
"reason.codelens.enabled": true
Advanced Features
Case splitting
For the examples below, <cursor>
represents the position of the current VS Code editor cursor.
switch
Introducing a In order to introduce a switch
, execute the following steps:
- select an identifier or move the cursor anywhere within its word range (as below)
- open the palette (โงโP) and run
Reason: case split
(typingcase
should pull it up)
Before
let foo (arg: list 'a) => a<cursor>rg;
After
let foo (arg: list 'a) => switch arg {
| [] => failwith "<case>"
| [_, ..._] => failwith "<case>"
};
switch
expressions
Nesting The switch
introduction functionality works with nested switch
expressions:
Before
let foo (arg: list 'a) => switch arg {
| [] => failwith "<case>"
| [_, ...xs] => x<cursor>s
};
After
let foo (arg: list 'a) => switch arg {
| [] => failwith "<case>"
| [_, ...xs] => switch xs {
| [] => failwith "<case>"
| [_, ..._] => failwith "<case>"
}
};
switch
Splitting a pattern without introducing a The case split feature can be used to split an existing pattern further:
Before
let foo (arg: list 'a) => switch arg {
| [] => failwith "<case>"
| [x, ...x<cursor>s] => failwith "<case>"
};
After
let foo (arg: list 'a) => switch arg {
| [] => failwith "<case>"
| [_] | [_, _, ..._] => failwith "<case>"
};