# gulp-css-ver

**Repository Path**: mirrors_LancerComet/gulp-css-ver

## Basic Information

- **Project Name**: gulp-css-ver
- **Description**: A small gulp tool to add version that based on md5 of pictures to "url()" in css files.
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2020-08-09
- **Last Updated**: 2025-12-27

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# gulp-css-ver
A small gulp tool to add version that based on md5 of pictures to "url()" in css files.

## Usage
cssVer(distDirName, secDistDirName, versionName);

`distDirName` is where the css files will be generated. Gulp-css-ver will try to read all pictrues that are required in css files and root path are based on `distDirName` firstly. Gulp-css-ver will try to read these picture files in `secDistDirName` if there are no these required-pictrue in folder `distDirName`.

Please note that `distDirName` is relative to **rootpath** of your project. 
For example, if your css files is in "PROJECT_DIR/public/index", then you should set `distDirName` to `public/index`.

If you provided a `versionName`, all querying params in `url(xxx?@queryingParam)` will be replaced with `versionName`. 


## Example
```
var gulp = require("gulp");
var rename = require("gulp-rename");
var stylus = require("gulp-stylus");
var autoprefixer = require("gulp-autoprefixer");
var sourcemap = require("gulp-sourcemaps");
var cssVer = require("gulp-css-ver");

gulp.task("stylus-to-css", function () {
        gulp.src("main-package.styl")
            .pipe(sourcemap.init())
            .pipe(stylus({
                compress: true
            }))
            .pipe(autoprefixer({
                browsers: ['> 1%', 'last 3 versions', 'Firefox ESR', "ie 8", "ie 9"]
            }))
            .pipe(cssVer("public/index", "dist/index"))
            .pipe(rename("bundle.min.css"))
            .pipe(sourcemap.write("."))
            .pipe(gulp.dest("./public/index"));  // dist.
});
```

## Result
Before:
```
background-image: url("xxx.png")
```
After:
```
background-image: url("xxx.png?xxxx")
```

## License
MIT.
© 2016 LancerComet.