2016-04-20 59 views
0

我已經配置了以下一飲而盡任務:Access文件名

var assets = plugins.useref.assets({searchPath: './'}), 
     css = plugins.filter('**/main.css'), 
     html = plugins.filter('**/*.html'); 
    return gulp 
     .src(config.html.srcheader) 
     .pipe(plugins.plumber()) 
     // collect all assets from source file by the means of useref 
     .pipe(assets) 
     //// minify main.css 
     .pipe(css) 
     .pipe(plugins.csso()) 
     .pipe(css.restore()) 
     //// Take inventory of the file names for future rev numbers 
     .pipe(plugins.rev()) 
     //// Apply the concat and file replacement with useref 
     .pipe(gulp.dest(config.rootdir)) 
     .pipe(assets.restore()) 
     .pipe(plugins.useref()) 
     //// Replace the file names in the html with rev numbers 
     .pipe(plugins.revReplace()) 
     .pipe(transformStream()) 
     //// rename source 
     .pipe(html) 
     .pipe(plugins.rename(config.html.customer.targetheader)) 
     .pipe(gulp.dest(config.html.dir)); 

代碼獲取CSS文件,minifies他們,增加了修訂(如主abcde123.css),替代了發生與處理文件的源文件。這是通過gulp-useref/gulp-rev/gulp-rev-replace插件完成的(plugins是一個包含所有已加載插件的對象,即plugins.useref--指代gulp-useref插件) 此代碼正常工作。 我試圖用相同的流中的結果CSS文件進行一些修改。

function transformStream() { 

    var collect = function(file, enc, cb) { 

     console.log(file); 
     return cb(); 
    } 

    var emit = function(cb) { 
     return cb(); 
    } 

    return through.obj(collect, emit); 
} 

在此背景下throughgulp-through2插件:由transformStream()功能,如下所示的方式完成的。

請看下面的代碼console.log(file);。 我想獲取縮小的CSS的文件名。上面的代碼顯示如下:

<File "assets/main-34d85b66.css" <Buffer 40 63 68 61 72 73 65 74 20 22 55 54 46 2d 38 22 3b 40 66 6f 6e 74 2d 66 61 63 65 7b 66 6f 6e 74 2d 66 61 6d 69 6c 79 3a 22 6d 74 63 22 3b 73 72 63 3a ... >> 

即它不包含文件名,但包含某種緩衝區。我閱讀了through2文檔,但沒有澄清這些事情。

所以,我的問題是:我如何可以訪問實際的文件名?

+0

您是否嘗試過file.relative的文件名? – JSess

回答

0

您可以在其上做一些簡單的迭代抓住從文件屬性:

for (var property in file) { 
    console.log(property); 
} 

/* 
    history    
    cwd     
    base     
    stat     
    _contents    
    isBuffer    
    isStream    
    isNull     
    isDirectory   
    clone     
    pipe     
    inspect 
*/ 

如果你正在尋找的文件名而已,那麼file.relative是你所需要的。

  • file.history會給你的工作目錄+文件名
  • file.cwd爲當前工作目錄
  • file.base爲基本路徑
0

你試過gulp-filenames?我不確定它在這種情況下會如何工作,但它會將新的版本化文件名存儲在內存中。事情是這樣的:

... 
return gulp 
    .src(config.html.srcheader) 
    .pipe(plugins.plumber()) 
    .pipe(assets) 
    .pipe(css) 
    .pipe(plugins.csso()) 
    .pipe(css.restore()) 
    .pipe(plugins.rev()) 
    .pipe(gulp.dest(config.rootdir)) 
    .pipe(assets.restore()) 
    .pipe(plugins.useref()) 
    .pipe(plugins.revReplace()) 
    .pipe(plugins.fileNames('my-css-file')) 
} 

然後你就可以得到稍後

function transformStream() { 
    var fileName = plugins.fileNames.get('my-css-file') 
}