remark for Visual Studio Code

Visual Studio Code extension to format and lint markdown files with remark.

Contents

• What is this?
• When should I use this?
• Install
• Use
• Configuration file
• Settings
• Formatting
• Plugins
• Compatibility
• Security
• Contribute
• License

What is this?

This project is a Visual Studio Code (VS Code) extension that you can use in your editor to inspect and change markdown files. This extension is built around remark, which is a very popular ecosystem of plugins that work with markdown. You can choose from the 150+ plugins that already exist or make your own.

See remark for info on what the remark ecosystem is.

When should I use this?

You can use this extension if you want to check (lint) and format markdown files from within your editor.

To configure this extension, you define your preferred markdown style in a configuration file (.remarkrc, .remarkrc.js, etc. or in package.json). This file is picked up by vscode-remark and other tools (useful for contributors that don’t use VS Code).

The configuration file is also used by remark-cli, which is recommended to be used alongside vscode-remark, as an npm script and/or in CI, to enforce the markdown style.

Install

Get it on the VS Code Marketplace or install it by using Quick Open (Ctrl + P) and running the following:

ext install unifiedjs.vscode-remark

Use

To use this extension, set up remark-cli like you normally would in your project with a configuration file. The extension will find the configuration in your workspace just like running remark-cli in your terminal would. You will be able to see your linter work as you type and you can format your code if you want it to.

Now, you can open markdown files in your project, and you’ll see squiggly lines and warnings in the Problems pane if the code doesn’t adhere to the coding standards. Here’s an example that should produce problems you can use to verify:

1) Hello, _Jupiter_ and *Neptune*!

Configuration file

remark-language-server uses the same configuration files as remark-cli. These files are:

• .remarkrc
• .remarkrc.cjs
• .remarkrc.js
• .remarkrc.json
• .remarkrc.mjs
• .remarkrc.yaml
• .remarkrc.yml
• package.json

Language clients should notify the language server if these files change. They are looked up starting at the folder where the checked markdown file exists.

Settings

This extension supports the following settings:

• remark.requireConfig (boolean, default: false) — If true, only perform actions if a configuration file is found.

Formatting

This extension can format markdown files.

To format a file, pull up the command pallete (Ctrl + Shift + P), choose Format Document With…, and select remark.

To make vscode-remark the default formatter for markdown, add the following to your settings.json (which you can open with Ctrl + ,):

{
  "[markdown]": {
    "editor.defaultFormatter": "unifiedjs.vscode-remark"
  }
}

Now markdown documents can be formatted using Ctrl + Shift + I.

You can optionally choose to automatically format when saving with editor.formatOnSave:

{
  "[markdown]": {
    "editor.defaultFormatter": "unifiedjs.vscode-remark",
    "editor.formatOnSave": true
  }
}

Plugins

The remark ecosystem has a variety of plugins available. Most notably you’ll want to check out remark-lint. See this curated list of plugins for more remark plugins.

Compatibility

This extension is compatible with Visual Studio Code versions 1.67.0 and greater.

Security

This plugin loads configuration files, plugins, and presets from your workspace. Only use this plugin in workspaces you trust.

Contribute

See contributing.md in remarkjs/.github for ways to get started. See support.md for ways to get help. Join us in Discussions to chat with the community and contributors.

This project has a code of conduct. By interacting with this repository, organization, or community you agree to abide by its terms.

License

MIT © Denis Malinochkin