postcss-error-to-vscode-diagnostic

Convert a CssSyntaxError of PostCSS into a diagnostic of Visual Studio Code

const postcss = require('postcss');
const postcssErrorToVscodeDiagnostic = require('postcss-error-to-vscode-diagnostic');

const {error} = postcss().process(`
  div {
    color::red
  }
`);
/* CssSyntaxError {
  reason: 'Double colon',
  line: 3,
  column: 11,
  ...
} */

stylelintWarningToVscodeDiagnostic(error);
/* {
  message: 'Double colon (syntax error)',
  severity: 1,
  range: {
    start: {
      line: 2,
      column: 10
    },
    end: {
      line: 2,
      column: 10
    }
  }
} */

Installation

Use npm.

npm install postcss-error-to-vscode-diagnostic

API

const postcssErrorToVscodeDiagnostic = require('postcss-error-to-vscode-diagnostic');

postcssErrorToVscodeDiagnostic(error [, additionalProperties])

error: CssSyntaxError
additionalProperties: Object
Return: Object (VS Code diagnostic)

The returned diagnostic has message, range and severity by default.

All properties of the second argument will be assigned to the return value. For example you can add a missing source property as below:

const error = postcss().process('foo');

postcssErrorToVscodeDiagnostic(error);
/* {
  message: 'Unknown word (syntax error)',
  severity: 1,
  range: { ... }
} */

postcssErrorToVscodeDiagnostic(error, {source: 'my-awesome-linter'});
/* {
  message: 'Unknown word (syntax error)',
  severity: 1,
  range: { ... },
  source: 'my-awesome-linter'
} */

License

Copyright (c) 2017 Shinnosuke Watanabe

Licensed under the MIT License.