# grunt-css-versioning

> Enables to use several versions (forks) of component styles

Latest version **0.1.0** (published 2014-07-29) · MIT license · 0 weekly downloads

## Install

```sh
npm install grunt-css-versioning
pnpm add grunt-css-versioning
yarn add grunt-css-versioning
bun add grunt-css-versioning
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.0 |
| Published | 2014-07-29 |
| First published | 2014-07-29 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Node | >= 0.8.0 |
| Dependencies | 1 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Cheshirsky |
| Maintainers | cheshirsky |
| Keywords | gruntplugin, css, versioning |

## Links

- npm: https://www.npmjs.com/package/grunt-css-versioning
- Repository: https://github.com/cheshirsky/grunt-css-versioning
- Issues: https://github.com/cheshirsky/grunt-css-versioning/issues
- npm.io page: https://npm.io/package/grunt-css-versioning

## Dependencies (1)

- [css](https://npm.io/package/css.md) 2.x.x

## Alternatives

- [style-dictionary](https://npm.io/package/style-dictionary.md) — 2.0M weekly downloads
- [postcss-merge-idents](https://npm.io/package/postcss-merge-idents.md) — 1.7M weekly downloads
- [@fontsource/noto-sans](https://npm.io/package/@fontsource/noto-sans.md) — 93.0K weekly downloads
- [uglifycss](https://npm.io/package/uglifycss.md) — 71.6K weekly downloads
- [mat4-interpolate](https://npm.io/package/mat4-interpolate.md) — 23.3K weekly downloads

## Recent versions

- 0.1.0 (latest) — 2014-07-29

## README

CSS versioning plugin for grunt.

## Description

This is just a beta version that was created as a prototype for some research.

## Installation

To install it you can simply clone it to your project node modules.

## Usage example

Here is the usage example.

The task works with several css files, which are named according to predefined rules (you can change it if you want).
That files can look this way:

myComponent.css:

```css
    myComponent {
        color: #3B3B3B;
    }

    myComponent a.link {
        border: 1px solid #333;
    }
```

myComponent--v2.css:

```css
    .myComponent {
        color: #000;
    }

    .myComponent a.link {
        border: 1px solid #bbb;
    }
```

myComponent--v3.css:

```css
    .myComponent {
        color: #3A2A1A;
    }

    .myComponent a.link {
        border: 4px solid #3b001F;
    }
```

Using the task you will have the following output:

```css
    .myComponent {
        color: #3B3B3B;
    }

    .myComponent a.link {
        border: 1px solid #333;
    }

    .v2--myComponent {
        color: #000;
    }

    .v2--myComponent a.link {
        border: 1px solid #bbb;
    }

    .v3--myComponent {
        color: #3A2A1A;
    }

    .v3--myComponent a.link {
        border: 4px solid #3b001F;
    }
```
Unfortunately, right now the task can't merge css classes to avoid extra defenitions.

## Options

### separator

|**Parameter**|Value|
| ------------- | ------- |
|**Name**|separator|
|**Type**|`String`|
|**Descriptions**|Defines the way of splitting for component name and version. RegExp part.|
|**Default value**|`"--"`|

N.B. Please use it carefully, because it is a part of regular expression.

### mergeVersion

|**Parameter**|Value|
| ------------- | ------- |
|**Name**|mergeVersion|
|**Type**|`Boolean`|
|**Descriptions**|Defines if we are to write all versioned css rules into component file|
|**Default value**|`true`|


N.B. This regExp is used to get array [fileName, componentName, versioningToken, extention] array.
For example ["component--v2.css", "component", "v2", "css"] for component--v2.css file.

## License

MIT

---
_Source: https://npm.io/package/grunt-css-versioning · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._