gulp-make-css-url-version-extend

    1.1.7 • Public • Published

    gulp-make-css-url-version-extend 是在 gulp-make-css-url-version-s 基础上做了bug修复版本

    修改了 gulp-make-css-url-version 增加版本号的方式:

    原来的日期模式是"yy-mm-dd" 修改成以毫秒为序列号

    原来的MD5模式引用字段过长引起CSS文件过大,现在截取前8位为版本号

    解决图片url以域名 ("http://", "https://", "//")为前缀导致找不到文件路径而无法修改版本号问题;

    可过滤不需要修改版本号的路径

    安装

    npm install gulp-make-css-url-version-extend

    使用

    默认MD5模式

    var makeUrlVer = require('gulp-make-css-url-version-extend');
     
    gulp.task('stylesheets', function() {
        gulp.src('css/*.css')
            .pipe(makeUrlVer())
            .pipe(gulp.dest('dist'))
    });

    配置

    使用日期模式:

    var makeUrlVer = require('gulp-make-css-url-version-extend');
     
    gulp.task('stylesheets', function() {
        gulp.src('css/*.css')
        //原格式:yy-mm-dd 修改后格式:201711061728(时间拼接精确到毫秒)  
            .pipe(makeUrlVer({useDate:true}))  
            .pipe(gulp.dest('dist'))
    });
    域名路径配置
    var makeUrlVer = require('gulp-make-css-url-version-extend');
    gulp.task('stylesheets', function() {
        gulp.src('css/*.css')
            .pipe(cssver({
                /*域名替换,路径必须以'/'结束 ;
                  例如" http://abc.com/images/logo.png" 用'../'替换后你可以处理的路径是'../images/logo.png' */
                domainName:'../',  
                //过滤不需要加版本号的域名 
                excludeDomain:["//abc.cn/","http://abc.com/"]}))
            .pipe(gulp.dest('dist'))
    });
     

    assetsDir: specify the public directory for correct MD5 calculation in some specific cases

    var makeUrlVer = require('gulp-make-css-url-version-extend');
     
    gulp.task('stylesheets', function() {
        gulp.src('css/*.css')
            .pipe(makeUrlVer({
                assetsDir: __dirname + '/public'
            }))
            .pipe(gulp.dest('dist'))
    });

    Example

    before: index.css

    /* loading */
    .i-loading{background:url(../images/loading.gif) ;} 
    .logo{background:url(//js.abc.com/images/loading.png) ;}    
       

    after: index.css

    /* loading */
    .i-loading{background:url(../images/loading.gif?v=Je0sUcMH)}
    .logo{background:url(//js.abc.com/images/logo.png?v=Je0sUcMH) ;}    

    Install

    npm i gulp-make-css-url-version-extend

    DownloadsWeekly Downloads

    0

    Version

    1.1.7

    License

    MIT

    Last publish

    Collaborators

    • yemaozhi