Skip to content

Commit

Permalink
docs(website): reworked the editor plugins section (biomejs#665)
Browse files Browse the repository at this point in the history
Co-authored-by: Superchupu <[email protected]>
  • Loading branch information
2 people authored and msdlisper committed Nov 4, 2023
1 parent fbc594b commit 230339c
Show file tree
Hide file tree
Showing 2 changed files with 57 additions and 27 deletions.
25 changes: 2 additions & 23 deletions website/src/content/docs/guides/getting-started.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -87,30 +87,9 @@ The command `check` is command meant to run multiple tools at once. Currently, i
- lint files
- organize imports

## Editor Setup
## Install an editor plugin

We recommend installing our editor integration to get the most out of Biome.
The Biome editor integration allows you to:

* Format files on save or when issuing the Format command.
* Lint files and apply code fixes

### VS Code

Install our official [Biome VS Code extension](https://marketplace.visualstudio.com/items?itemName=biomejs.biome) from the Visual Studio Marketplace.

To make Biome the default formatter open a supported file (JavaScript or TypeScript) and:

* open the *Command Palette* (View or <kbd>Ctrl</kbd>/<kbd title="Cmd">⌘</kbd>+<kbd title="Shift">⇧</kbd>+<kbd>P</kbd>)
* select *Format Document With...*
* select *Configure Default Formatter*
* select *Biome*.

### Other Editors

We would love to support more editors, but we don't have the capacity to implement and maintain multiple editor integrations at the moment.
Because Biome uses the language server protocol (LSP), it should be relatively easy to get Biome working with any editor with an LSP client.
If you're interested in building an integration for Biome, please, reach out, and we would be more than happy to support you.
We recommend installing an editor plugin to get the most out of Biome. Check out the [editor page](/guides/integrate-in-editor) to know which editors support Biome.


## CI Setup
Expand Down
59 changes: 55 additions & 4 deletions website/src/content/docs/guides/integrate-in-editor.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,61 @@ title: Integrate Biome in your editor
description: Learn how you can integrate Biome with editors and IDEs
---

## LSP first-class support
## First-party plugins

These are plugins that are maintained by the Biome team and part of the [Biome organization](https://github.com/biomejs).

### VS Code

The Biome editor integration allows you to:

* Format files on save or when issuing the Format command.
* Lint files and apply code fixes

Install our official [Biome VS Code extension](https://marketplace.visualstudio.com/items?itemName=biomejs.biome) from the Visual Studio Marketplace.

To make Biome the default formatter open a [supported file](/internals/language-support/) and:

* open the *Command Palette* (View or <kbd>Ctrl</kbd>/<kbd title="Cmd">⌘</kbd>+<kbd title="Shift">⇧</kbd>+<kbd>P</kbd>)
* select *Format Document With...*
* select *Configure Default Formatter*
* select *Biome*.

### IntelliJ

To install the Biome IntelliJ plugin, head over to [official plugin page](https://plugins.jetbrains.com/plugin/22761-biome) or follow these steps:

**From JetBrains IDEs:**

1. Open IntelliJ IDEA.
2. Go to **Settings/Preferences**.
3. Select **Plugins** from the left-hand menu.
4. Click on the **Marketplace** tab.
5. Search for "Biome" and click **Install**.
6. Restart the IDE to activate the plugin.

**From disk:**

1. Download the plugin .zip from releases tab.
2. Press `⌘Сmd,` to open the IDE settings and then select Plugins.
3. On the Plugins page, click The Settings button and then click Install Plugin from Disk….

## Third-party plugins

These are plugin maintained by other communities, that you install in your editor:
- [`neovim`](https://neovim.io/): you'll have to install [`nvim-lspconfig`](https://github.com/neovim/nvim-lspconfig/), and follow the [instructions](https://github.com/neovim/nvim-lspconfig/blob/master/doc/server_configurations.md#biome);
- [`helix`](https://helix-editor.com/): follow the instruction of [this manual](https://github.com/biomejs/biome/blob/main/editors/helix/manual.md)

:::note
Is there a plugin for an editor that isn't listed here? Please file a PR and we will be happy to add it to the list
:::

## Write your own plugin

Biome has [LSP](https://microsoft.github.io/language-server-protocol/) first-class support. If your editor does implement LSP, then the integration of Biome should be seamless.

### Use the LSP proxy

Biome has a command called `lsp-proxy`. When executed, Biome will spawn two processes:
- a [daemon](/internals/architecture#daemon) that does execute the requested operations;
- a server that functions as a proxy between the requests of the client - the editor - and the server - the daemon;
Expand All @@ -15,7 +66,7 @@ If your editor is able to interact with a server and send [JSON-RPC](https://www

You can check how the [`neo-vim biome plugin`](https://github.com/neovim/nvim-lspconfig/blob/master/lua/lspconfig/server_configurations/biome.lua) does it.

## Use `stdin`
### Use `stdin`

If your editor doesn't support LSP, you use directly the binary `biome` and call it using [standard input](https://en.wikipedia.org/wiki/Standard_streams#Standard_input_(stdin)).

Expand All @@ -26,7 +77,7 @@ The following commands can be called via standard input:

Biome will return the new output (or the original output if changes haven't occurred) to [standard output](https://en.wikipedia.org/wiki/Standard_streams#Standard_output_(stdout)) and the diagnostics to [standard error](https://en.wikipedia.org/wiki/Standard_streams#Standard_error_(stderr)).

When you used `stdin`, you must pass the `--stdin-file-path` option. The file `path` **doesn't need to exist** in your file system, it can be any name. **What's important** is to provide the correct file extension, so Biome knows **how to treat** your file.
When you use `stdin`, you must pass the `--stdin-file-path` option. The file `path` **doesn't need to exist** in your file system, it can be any name. **What's important** is to provide the correct file extension, so Biome knows **how to treat** your file.

It's the editor's responsibility to locate the resolve the path of the binary and then call it when it's needed. The binaries are shipped to npm based on the architectures and OS that we support:

Expand Down Expand Up @@ -62,7 +113,7 @@ If you decide to use the daemon, you're also responsible to restart/kill the pro
Operations via the daemon are significantly slower than the CLI itself, so it's advised to run operations only on single files.
:::

## Daemon logs
### Daemon logs

The Biome daemon saves logs in your file system. Logs are store in a folder called `biome-logs`. You can fine this folder in the temporary directory of your operating system.

Expand Down

0 comments on commit 230339c

Please sign in to comment.