GithubHelp home page GithubHelp logo

logicer16 / eslint-plugin-yml Goto Github PK

View Code? Open in Web Editor NEW

This project forked from ota-meshi/eslint-plugin-yml

0.0 0.0 0.0 1.27 MB

This ESLint plugin provides linting rules for YAML.

Home Page: https://ota-meshi.github.io/eslint-plugin-yml/

License: MIT License

JavaScript 1.23% TypeScript 98.77%

eslint-plugin-yml's Introduction

Introduction

eslint-plugin-yml is ESLint plugin provides linting rules for YAML.

NPM license NPM version NPM downloads NPM downloads NPM downloads NPM downloads NPM downloads Build Status Coverage Status

๐Ÿ“› Features

This ESLint plugin provides linting rules for YAML.

  • You can use ESLint to lint YAML.
  • You can find out the problem with your YAML files.
  • You can apply consistent code styles to your YAML files.
  • Supports Vue SFC custom blocks such as <i18n lang="yaml">.
    Requirements vue-eslint-parser v7.3.0 and above.
  • Supports ESLint directives. e.g. # eslint-disable-next-line
  • You can check your code in real-time using the ESLint editor integrations.

You can check on the Online DEMO.

โ“ How is it different from other YAML plugins?

Plugins that do not use AST

e.g. eslint-plugin-yaml

These plugins use the processor to parse and return the results independently, without providing the ESLint engine with AST and source code text.

Plugins don't provide AST, so you can't use directive comments (e.g. # eslint-disable).
Plugins don't provide source code text, so you can't use it with plugins and rules that use text (e.g. eslint-plugin-prettier, eol-last).

eslint-plugin-yml works by providing AST and source code text to ESLint.

๐Ÿ“– Documentation

See documents.

๐Ÿ’ฟ 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

New Config (eslint.config.js)

Use eslint.config.js file to configure rules. See also: https://eslint.org/docs/latest/use/configure/configuration-files-new.

Example eslint.config.js:

import eslintPluginYml from 'eslint-plugin-yml';
export default [
  // add more generic rule sets here, such as:
  // js.configs.recommended,
  ...eslintPluginYml.configs['flat/recommended'],
  {
    rules: {
      // override/add rules settings here, such as:
    // 'yml/rule-name': 'error'
    }
  }
];

This plugin provides configs:

  • *.configs['flat/base'] ... Configuration to enable correct YAML parsing.
  • *.configs['flat/recommended'] ... Above, plus rules to prevent errors or unintended behavior.
  • *.configs['flat/standard'] ... Above, plus rules to enforce the common stylistic conventions.
  • *.configs['flat/prettier'] ... Turn off rules that may conflict with Prettier.

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

Legacy Config (.eslintrc)

Use .eslintrc.* file to configure rules. See also: https://eslint.org/docs/latest/use/configure/.

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.

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",
    },
  ],
  // ...
};

Parser Options

The following parser options for yaml-eslint-parser are available by specifying them in parserOptions in the ESLint configuration file.

module.exports = {
  // ...
  overrides: [
    {
      files: ["*.yaml", "*.yml"],
      parser: "yaml-eslint-parser",
      // Options used with yaml-eslint-parser.
      parserOptions: {
        defaultYAMLVersion: "1.2",
      },
    },
  ],
  // ...
};

See also https://github.com/ota-meshi/yaml-eslint-parser#readme.

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 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 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",
    "github-actions-workflow" // for GitHub Actions workflow files
  ]
}

JetBrains WebStorm IDEs

In any of the JetBrains IDEs you can configure the linting scope. 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}
                                 ^^^^ ^^^

โœ… Rules

The --fix option on the command line automatically fixes problems reported by rules which have a wrench ๐Ÿ”ง below.
The rules with the following star โญ are included in the config.

YAML Rules

Rule ID Description Fixable RECOMMENDED STANDARD
yml/block-mapping-colon-indicator-newline enforce consistent line breaks after : indicator ๐Ÿ”ง
yml/block-mapping-question-indicator-newline enforce consistent line breaks after ? indicator ๐Ÿ”ง โญ
yml/block-mapping require or disallow block style mappings. ๐Ÿ”ง โญ
yml/block-sequence-hyphen-indicator-newline enforce consistent line breaks after - indicator ๐Ÿ”ง โญ
yml/block-sequence require or disallow block style sequences. ๐Ÿ”ง โญ
yml/file-extension enforce YAML file extension
yml/indent enforce consistent indentation ๐Ÿ”ง โญ
yml/key-name-casing enforce naming convention to key names
yml/no-empty-document disallow empty document โญ โญ
yml/no-empty-key disallow empty mapping keys โญ โญ
yml/no-empty-mapping-value disallow empty mapping values โญ โญ
yml/no-empty-sequence-entry disallow empty sequence entries โญ โญ
yml/no-tab-indent disallow tabs for indentation. โญ โญ
yml/no-trailing-zeros disallow trailing zeros for floats ๐Ÿ”ง
yml/plain-scalar require or disallow plain style scalar. ๐Ÿ”ง โญ
yml/quotes enforce the consistent use of either double, or single quotes ๐Ÿ”ง โญ
yml/require-string-key disallow mapping keys other than strings
yml/sort-keys require mapping keys to be sorted ๐Ÿ”ง
yml/sort-sequence-values require sequence values to be sorted ๐Ÿ”ง
yml/vue-custom-block/no-parsing-error disallow parsing errors in Vue custom blocks โญ โญ

Extension Rules

Rule ID Description Fixable RECOMMENDED STANDARD
yml/flow-mapping-curly-newline enforce consistent line breaks inside braces ๐Ÿ”ง โญ
yml/flow-mapping-curly-spacing enforce consistent spacing inside braces ๐Ÿ”ง โญ
yml/flow-sequence-bracket-newline enforce linebreaks after opening and before closing flow sequence brackets ๐Ÿ”ง โญ
yml/flow-sequence-bracket-spacing enforce consistent spacing inside flow sequence brackets ๐Ÿ”ง โญ
yml/key-spacing enforce consistent spacing between keys and values in mapping pairs ๐Ÿ”ง โญ
yml/no-irregular-whitespace disallow irregular whitespace โญ โญ
yml/no-multiple-empty-lines disallow multiple empty lines ๐Ÿ”ง
yml/spaced-comment enforce consistent spacing after the # in a comment ๐Ÿ”ง โญ

๐Ÿš€ To Do More Verification

Verify using JSON Schema

You can verify using JSON Schema by checking and installing eslint-plugin-json-schema-validator.

Verify the Vue I18n message resource files

You can verify the message files by checking and installing @intlify/eslint-plugin-vue-i18n.

๐Ÿšฅ Semantic Versioning Policy

eslint-plugin-yml follows Semantic Versioning and ESLint's Semantic Versioning Policy.

๐Ÿป Contributing

Welcome contributing!

Please use GitHub's Issues/PRs.

Development Tools

  • npm test runs tests and measures coverage.
  • npm run update runs in order to update readme and recommended configuration.

Working With Rules

This plugin uses yaml-eslint-parser for the parser. Check here to find out about AST.

๐Ÿ‘ซ Related Packages

๐Ÿ”’ License

See the LICENSE file for license rights and limitations (MIT).

eslint-plugin-yml's People

Contributors

danielrentz avatar github-actions[bot] avatar joseh29 avatar leotm avatar logicer16 avatar mogsdad avatar ota-meshi avatar renovate-bot avatar renovate[bot] avatar sun-yryr avatar sxyazi avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.