https://github.com/matype/postcss-validator

PostCSS plugin to check if an input string is valid CSS
https://github.com/matype/postcss-validator

Last synced: about 1 month ago
JSON representation

PostCSS plugin to check if an input string is valid CSS

• Host: GitHub
• URL: https://github.com/matype/postcss-validator
• Owner: matype
• License: other
• Created: 2017-03-14T14:04:59.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2020-07-24T19:27:41.000Z (over 4 years ago)
• Last Synced: 2024-09-14T09:57:11.229Z (about 2 months ago)
• Language: JavaScript
• Size: 8.79 KB
• Stars: 3
• Watchers: 1
• Forks: 1
• Open Issues: 2
• Metadata Files:
  • Readme: readme.md
  • Changelog: changelog.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# postcss-validator [![Build Status](https://travis-ci.org/morishitter/postcss-validator.svg)](https://travis-ci.org/morishitter/postcss-validator)

PostCSS is very flexible CSS parser, so we can extend CSS syntax easily.

But, The output of PostCSS plugins may not be valid CSS string.

[postcss-validator](https://github.com/morishitter/postcss-validator) can check if an input string is valid CSS.

## Features

postcss-validator can check to using the followings:

- Nested selector (like Sass)

- Unknown properties

## Example

### Using nested selectors

Input:

```

.class {

  color: tomato;

  .nested {

    color: lime;

  }

}

```

Yield:

```

CssSyntaxError: postcss-validator: :2:3: Nested rules [.nested]

```

### Using unknown property

Input:

```

.class {

  margintop: 10px;

}

```

Yield:

```

CssSyntaxError: postcss-validator: :2:3: Unknown property [margintop] is used

```

## Installation

```shell

$ npm install postcss-validator

```

## Usage

Set postcss-validator at the bottom of loaded PostCSS plugins.

### in Node.js

```js

// dependencies

var fs = require("fs")

var postcss = require("postcss")

var customProperties = require("postcss-custom-properties")

var nesting = require("postcss-nesting")

var validator = require("postcss-validator")

// css to be processed

var css = fs.readFileSync("input.css", "utf8")

// process css

var output = postcss()

  .use(customProperties())

  .use(nesting())

  .use(validator())

  .process(css)

  .css

```

## License

The MIT License (MIT)

Copyright (c) 2017 Masaaki Morishita