# User Guide

# 💿 Installation

npm install --save-dev eslint eslint-plugin-yml

Requirements

  • ESLint v6.0.0 and above
  • Node.js v14.17.x, v16.x and above

# 📖 Usage

# Configuration

Use .eslintrc.* file to configure rules. See also: https://eslint.org/docs/user-guide/configuring (opens new window).

Example .eslintrc.js:

module.exports = {
  extends: [
    // add more generic rulesets here, such as:
    // 'eslint:recommended',
    'plugin:yml/standard'
  ],
  rules: {
    // override/add rules settings here, such as:
    // 'yml/rule-name': 'error'
  }
}

This plugin provides configs:

  • plugin:yml/base ... Configuration to enable correct YAML parsing.
  • plugin:yml/recommended ... Above, plus rules to prevent errors or unintended behavior.
  • plugin:yml/standard ... Above, plus rules to enforce the common stylistic conventions.
  • plugin:yml/prettier ... Turn off rules that may conflict with Prettier (opens new window).

See the rule list to get the rules that this plugin provides.

# Parser Configuration

If you have specified a parser, you need to configure a parser for .yaml.

For example, if you are using the "@babel/eslint-parser", configure it as follows:

module.exports = {
  // ...
  extends: ["plugin:yml/standard"],
  // ...
  parser: "@babel/eslint-parser",
  // Add an `overrides` section to add a parser configuration for YAML.
  overrides: [
    {
      files: ["*.yaml", "*.yml"],
      parser: "yaml-eslint-parser",
    },
  ],
  // ...
};

# Running ESLint from the command line

If you want to run eslint from the command line, make sure you include the .yaml extension using the --ext option (opens new window) or a glob pattern, because ESLint targets only .js files by default.

Examples:

eslint --ext .js,.yaml,.yml src
eslint "src/**/*.{js,yaml,yml}"

# 💻 Editor Integrations

# Visual Studio Code

Use the dbaeumer.vscode-eslint (opens new window) extension that Microsoft provides officially.

You have to configure the eslint.validate option of the extension to check .yaml files, because the extension targets only *.js or *.jsx files by default.

Example .vscode/settings.json:

{
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        "yaml"
    ]
}

# JetBrains WebStorm IDEs

In any of the JetBrains IDEs you can configure the linting scope (opens new window). Following the steps in their help document, you can add YAML files to the scope like so:

  1. Open the Settings/Preferences dialog, go to Languages and Frameworks | JavaScript | Code Quality Tools | ESLint, and select Automatic ESLint configuration or Manual ESLint configuration.
  2. In the Run for files field, update the pattern that defines the set of files to be linted to include YAML files as well:
{**/*,*}.{js,ts,jsx,tsx,html,vue,yaml,yml}
                                 ^^^^ ^^^

# ❓ FAQ

  • TODO
Last Updated: 5/24/2022, 10:03:12 PM