> ## Documentation Index
> Fetch the complete documentation index at: https://docs.semgrep.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Use the Semgrep rule schema to write rules in VS Code

You may already be familiar with writing rules in the [Semgrep Editor](/semgrep-code/editor). However, if your IDE of choice is VS Code and you'd like to write Semgrep rules there, using the Semgrep rule schema will provide a richer editing environment, allowing VS Code to understand the shape of your rule's YAML file, including its value sets, defaults, and descriptions ([reference](https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml#associating-schemas)).

<Tip>
  **TIP**

  Writing rules locally in your IDE is also helpful for iteratively testing them against an entire local repository, as opposed to just a snippet of test code.
</Tip>

When the schema is set up, auto-completion operates in your VS Code IDE just as it does in the Semgrep Editor when writing rules:

<Frame>
  <img src="https://mintcdn.com/semgrep-ee9d73d8/yMsI1pCt6oL_Pkb9/images/kb/rules/using-semgrep-rule-schema-in-vscode/vscode-schema-autocomplete-example.png?fit=max&auto=format&n=yMsI1pCt6oL_Pkb9&q=85&s=5e96891c4bb1334c317d47ae891b9838" alt="Example Semgrep YAML rule file with auto-complete" width="836" height="582" data-path="images/kb/rules/using-semgrep-rule-schema-in-vscode/vscode-schema-autocomplete-example.png" />
</Frame>

## Add the Semgrep rule schema in VS Code

Adding the Semgrep rule schema in VS Code requires two steps:

<Steps>
  <Step>
    Install the YAML Language Support extension by Red Hat
  </Step>

  <Step>
    Associate the Semgrep rule schema
  </Step>
</Steps>

### Install the YAML Language Support extension by Red Hat

You can install the  "YAML" extension authored by "Red Hat" directly in VS Code or by going to the Visual Studio Marketplace and installing it from there. In VS Code, go to the **Extensions** pane and search for `yaml`. This should yield the correction extension as the top result. However, please verify that you are installing the correct extension by ensuring it is the same as [this one](https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml).

### Associate the Semgrep rule schema

Once the extension is installed, associate the Semgrep rule schema with the Semgrep YAML rule definitions you are working on in VS Code using one of following methods:

1. Directly in the YAML file
2. Using `yaml.schemas` in your VS Code `settings.json` file

We recommend taking a look at the [extension overview section on associating schemas](https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml#associating-schemas) to gain a preliminary understanding before proceeding.

#### Associate a schema directly in the YAML file

To associate the schema directly within a Semgrep YAML rule file, include the following line at the top of the file:

```yaml theme={null}
# yaml-language-server: $schema=https://json.schemastore.org/semgrep.json
```

The drawback to this method is that it must be done independently for each YAML rule file.

#### Associate a schema to a glob pattern via `yaml.schemas`

Before proceeding, we recommend reading the [extension overview](https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml#associating-a-schema-to-a-glob-pattern-via-yaml.schemas) as a supplement to this article to better understand how YAML schemas are handled by the extension.

To associate the Semgrep rule schema via `yaml.schemas` in your VS Code `settings.json` file (on macOS), go to:

Code -> Settings -> Settings -> Extensions -> YAML

In the YAML extension settings, scroll down to `Yaml: Schemas` and click `Edit in settings.json`, as shown below:

<Frame>
  <img src="https://mintcdn.com/semgrep-ee9d73d8/yMsI1pCt6oL_Pkb9/images/kb/rules/using-semgrep-rule-schema-in-vscode/vscode-yaml-schemas.png?fit=max&auto=format&n=yMsI1pCt6oL_Pkb9&q=85&s=c9d1d35022ec20a76322283a38fbdaf9" alt="MacOS VS Code YAML extension settings" width="1338" height="1080" data-path="images/kb/rules/using-semgrep-rule-schema-in-vscode/vscode-yaml-schemas.png" />
</Frame>

This opens the `settings.json` file with an empty `yaml.schemas` object ready to be defined. For example, consider the following `yaml.schemas` definition:

```json theme={null}
"yaml.schemas": {
    "https://json.schemastore.org/semgrep.json": "Downloads/semgrep_rules/*.yaml"
}
```

This associates the schema defined on the left side of the colon (`:`) with files matching the glob pattern on the right. The glob pattern matches any `.yaml` file located in a directory structure that matches `Downloads/semgrep_rules/`. The desired glob pattern differs for varying operating systems and should reflect where you are storing Semgrep YAML rule files.

After completing the configuration for `yaml.schemas`, open a Semgrep rule YAML file to verify that a notice shows at the top similar to this one:

<Frame>
  <img src="https://mintcdn.com/semgrep-ee9d73d8/yMsI1pCt6oL_Pkb9/images/kb/rules/using-semgrep-rule-schema-in-vscode/vscode-yaml-schema-example-file.png?fit=max&auto=format&n=yMsI1pCt6oL_Pkb9&q=85&s=a076a1c006d91b6bcd74e905cb429fa4" alt="Example Semgrep YAML rule file with schema defined" width="1376" height="288" data-path="images/kb/rules/using-semgrep-rule-schema-in-vscode/vscode-yaml-schema-example-file.png" />
</Frame>

This indicates that you've successfully associated the Semgrep rule schema with your Semgrep rule YAML file(s).
