npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

vscode-yaml

v0.13.0

Published

YAML Language Support by Red Hat, with built-in Kubernetes syntax support

Downloads

43

Readme

CI Build Status Marketplace Version

YAML Language Support by Red Hat

Provides comprehensive YAML Language support to Visual Studio Code, via the yaml-language-server, with built-in Kubernetes syntax support.

Supports JSON Schema 7 and below.

Features

screencast

  1. YAML validation:
    • Detects whether the entire file is valid yaml
    • Detects errors such as:
      • Node is not found
      • Node has an invalid key node type
      • Node has an invalid type
      • Node is not a valid child node
  2. Document Outlining (Ctrl + Shift + O):
    • Provides the document outlining of all completed nodes in the file
  3. Auto completion (Ctrl + Space):
    • Auto completes on all commands
    • Scalar nodes autocomplete to schema's defaults if they exist
  4. Hover support:
    • Hovering over a node shows description if provided by schema
  5. Formatter:
    • Allows for formatting the current file

Auto completion and hover support are provided by the schema. Please refer to Language Server Settings to setup a schema

Language Server Settings

The following settings are supported:

  • yaml.format.enable: Enable/disable default YAML formatter (requires restart)
  • yaml.format.singleQuote: Use single quotes instead of double quotes
  • yaml.format.bracketSpacing: Print spaces between brackets in objects
  • yaml.format.proseWrap: Always: wrap prose if it exeeds the print width, Never: never wrap the prose, Preserve: wrap prose as-is
  • yaml.format.printWidth: Specify the line length that the printer will wrap on
  • yaml.validate: Enable/disable validation feature
  • yaml.hover: Enable/disable hover
  • yaml.completion: Enable/disable autocompletion
  • yaml.schemas: Helps you associate schemas with files in a glob pattern
  • yaml.schemaStore.enable: When set to true the YAML language server will pull in all available schemas from JSON Schema Store
  • yaml.customTags: Array of custom tags that the parser will validate against. It has two ways to be used. Either an item in the array is a custom tag such as "!Ref" and it will automatically map !Ref to scalar or you can specify the type of the object !Ref should be e.g. "!Ref sequence". The type of object can be either scalar (for strings and booleans), sequence (for arrays), mapping (for objects).
  • [yaml]: VSCode-YAML adds default configuration for all yaml files. More specifically it converts tabs to spaces to ensure valid yaml, sets the tab size, and allows live typing autocompletion. These settings can be modified via the corresponding settings inside the [yaml] section in the settings:
    • editor.insertSpaces
    • editor.tabSize
    • editor.quickSuggestions
Adding custom tags

In order to use the custom tags in your YAML file you need to first specify the custom tags in the setting of your code editor. For example, you can have the following custom tags:

"yaml.customTags": [
    "!Scalar-example scalar",
    "!Seq-example sequence",
    "!Mapping-example mapping"
]

The !Scalar-example would map to a scalar custom tag, the !Seq-example would map to a sequence custom tag, the !Mapping-example would map to a mapping custom tag.

You can then use the newly defined custom tags inside the YAML file:

some_key: !Scalar-example some_value
some_sequence: !Seq-example
  - some_seq_key_1: some_seq_value_1
  - some_seq_key_2: some_seq_value_2
some_mapping: !Mapping-example
  some_mapping_key_1: some_mapping_value_1
  some_mapping_key_2: some_mapping_value_2
Associating a schema to a glob pattern via yaml.schemas:

yaml.schemas applies a schema to a file. In other words, the schema (placed on the left) is applied to the glob pattern on the right. Your schema can be local or online. Your schema must be a relative path and not an absolute path.

When associating a schema it should follow the format below

"yaml.schemas": {
    "url": "globPattern",
    "Kubernetes": "globPattern"
}

e.g.

"yaml.schemas": {
    "http://json.schemastore.org/composer": ["/*"],
    "file:///home/johnd/some-schema.json": ["some.yaml"],
    "../relative/path/schema.json": ["/config*.yaml"],
    "/Users/johnd/some-schema.json": ["some.yaml"],
}

e.g.

"yaml.schemas": {
    "kubernetes": ["/myYamlFile.yaml"]
}

e.g.

"yaml.schemas": {
    "http://json.schemastore.org/composer": ["/*"],
    "kubernetes": ["/myYamlFile.yaml"]
}

Since 0.11.0 YAML Schemas can be used for validation:

 "/home/user/custom_schema.yaml": "someFilePattern.yaml"
  • The entrance point for yaml.schemas is location in user and workspace settings
  • Supports schemas through schema store as well as any other schema url
  • Supports 'yamlValidation' point which allows you to contribute a schema for a specific type of yaml file (Similar to jsonValidation) e.g.
{
  "contributes": {
    "yamlValidation": [
      {
        "fileMatch": "yourfile.yml",
        "url": "./schema.json"
      }
    ]
  }
}

This extension allows you to specify json schemas that you want to validate against the yaml that you write. In the vscode user and workspace preferences you can set a url and a glob pattern that you want to validate against the schema. Kubernetes is an optional field. They do not require a url as the language server will provide that. You just need the keyword kubernetes and a glob pattern.

Developer Support

Getting started

  1. Install prerequisites:
  2. Fork and clone this repository and go into the folder
     $ cd vscode-yaml
  3. Install the dependencies
    $ npm install
  4. Compile the Typescript to Javascript
    $ npm run compile

Developing the client side

  1. Open the client in vscode
  2. Make changes as neccessary and the run the code using F5

Developing the client and server together

  1. Download both the Yaml Language Server and this VSCode Yaml Client.

  2. Create a project with the directories in the following structure.

ParentFolder/
          ├──── vscode-yaml/
          ├──── yaml-language-server/
  1. Run npm install in both directories to initialize node_modules dependencies.

  2. In vscode-yaml/src/extension.ts set the serverModule variable to:

    serverModule = context.asAbsolutePath(path.join('..', 'yaml-language-server', 'out', 'server', 'src', 'server.js'));

    This will redirect which YAML LS to use.

  3. In BOTH directories run:

    npm run compile
  4. To run the language server in VSCode, click View -> Debug, then from the drop down menu beside the green arrow select Launch Extension (vscode-yaml), click the arrow, and a new VSCode window should load with the YAML LS running.

  5. To debug the language server in VSCode, from the same drop down menu select Attach (yaml-language-server), and click the green arrow to start. Ensure you've opened a YAML file or else the server would have not yet started.

Note: Disable or remove any existing implementations of the YAML Language server from VSCode or there will be conflicts.

Developing the server side
  1. To develop the language server visit https://github.com/redhat-developer/yaml-language-server

Refer to VS Code documentation on how to run and debug the extension

Installation from Github Release

To obtain and install the latest release from github you can:

  • First download the latest *.vsix file from Github Releases section
  • Inside of VSCode navigate to the extension tab and click the three elipses (...).
  • Click install from VSIX and provide the location of the *.vsix that was downloaded

Contributing

All contributions are welcome!