2015-10-18 94 views
2

我正在構建一個學習React w/Flux的相對簡單的項目。我正在使用(或試圖使用)Gulp來創建一個使用Browserify,Reactify,Streamify和Uglify的自動化構建,所有這些都是通過npm安裝的。整個流程正在工作,我做了一些文件更改,重新構建,現在當我運行構建時,它正在出錯。即使在恢復更改並返回到之前的工作狀態之後。我懷疑可能是某處發生了權限更改,但我自己並沒有這樣做,所以我不確定如何進一步診斷(並且不確定問題是否存在)。gulp build上的錯誤gulp-uglify minifier'file.isNull()'錯誤

我應該補充說,起初我懷疑乙烯基流動錯誤是問題,但我在構建流程中添加了.pipe(buffer())vinyl-buffer,但它沒有改變錯誤。

這裏的一飲而盡:

var gulp = require('gulp'); 
var uglify = require('gulp-uglify'); 
var htmlreplace = require('gulp-html-replace'); 
var source = require('vinyl-source-stream'); 
var buffer = require('vinyl-buffer'); 
var browserify = require('browserify'); 
var watchify = require('watchify'); 
var reactify = require('reactify'); 
var streamify = require('gulp-streamify'); 
var gutil = require('gulp-util'); 

var path = { 
    HTML: 'app/index.html', 
    MINIFIED_OUT: 'build.min.js', 
    OUT: 'build.js', 
    DEST: 'dist', 
    DEST_BUILD: 'dist/build', 
    DEST_SRC: 'dist/src', 
    ENTRY_POINT: './app/App.js' 
}; 

gulp.task('build', function(){ 
    browserify({ 
     entries: [path.ENTRY_POINT], 
     transform: [reactify] 
    }) 
     .bundle() 
     .pipe(uglify().on('error', gutil.log)) 
     .pipe(source(path.MINIFIED_OUT)) 
     .pipe(buffer()) 
     .pipe(streamify(uglify(path.MINIFIED_OUT))) 
     .pipe(gulp.dest(path.DEST_BUILD)); 
}); 

gulp.task('replaceHTML', function(){ 
    gulp.src(path.HTML) 
     .pipe(htmlreplace({ 
      'js': 'build/' + path.MINIFIED_OUT 
     })) 
     .pipe(gulp.dest(path.DEST)); 
}); 

gulp.task('production', ['replaceHTML', 'build']); 

以下是錯誤:

[09:54:33] Using gulpfile /Library/WebServer/Documents/lldb/gulpfile.js 
[09:54:33] Starting 'replaceHTML'... 
[09:54:33] Finished 'replaceHTML' after 8.3 ms 
[09:54:33] Starting 'build'... 
[09:54:33] Finished 'build' after 27 ms 
[09:54:33] Starting 'production'... 
[09:54:33] Finished 'production' after 7.07 μs 
/Library/WebServer/Documents/lldb/node_modules/gulp-uglify/minifier.js:67 
    if (file.isNull()) { 
      ^

TypeError: file.isNull is not a function 
    at DestroyableTransform.minify [as _transform] (/Library/WebServer /Documents/lldb/node_modules/gulp-uglify/minifier.js:67:14) 
    at DestroyableTransform.Transform._read (/Library/WebServer/Documents/lldb/node_modules/gulp-uglify/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:172:10) 
    at DestroyableTransform.Transform._write (/Library/WebServer/Documents/lldb/node_modules/gulp-uglify/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:160:12) 
    at doWrite (/Library/WebServer/Documents/lldb/node_modules/gulp-uglify/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:326:12) 
    at writeOrBuffer (/Library/WebServer/Documents/lldb/node_modules/gulp-uglify/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:312:5) 
    at DestroyableTransform.Writable.write (/Library/WebServer/Documents/lldb/node_modules/gulp-uglify/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:239:11) 
    at Readable.ondata (/Library/WebServer/Documents/lldb/node_modules/browserify/node_modules/read-only-stream/node_modules/readable-stream/lib/_stream_readable.js:572:20) 
    at emitOne (events.js:77:13) 
    at Readable.emit (events.js:169:7) 
    at readableAddChunk (/Library/WebServer/Documents/lldb/node_modules/browserify/node_modules/read-only-stream/node_modules/readable-stream/lib/_stream_readable.js:195:16) 

歡迎任何想法 - 謝謝。

回答

3

Notice the removal of the extra parentheses -(). This returns these to the references they should be, not the functions the js is trying to call. How the extra() got written into isNull and isStream between when my code was running and when it stopped running is anyone's guess (and a little concerning) - I did not make those changes.

它們是引用,是的,但引用了在模塊中導出的函數。 require('./lib/isNull')返回該模塊的導出;導出是一個函數,所以isNull是一個函數。通過刪除括號,您現在只檢查file.isNull是否總是爲真。

但是,無論如何你都在看錯誤的東西。這不是file來自哪裏。將file作爲參數傳遞給minify函數。所以file是應該有isNullisStream方法的對象。

minify功能正在調用through2,所以如果你的吞噬文件失敗了,那麼這可能意味着你做錯了什麼,可能與順序。不幸的是,這些錯誤信息大部分時間都不是很有用。

當你gulpfile看,我注意到,你有兩個呼叫uglify

.pipe(uglify().on('error', gutil.log)) 
… 
.pipe(streamify(uglify(path.MINIFIED_OUT))) 

第一個看起來不錯,是什麼gulp-uglify平時的樣子。但第二個似乎更像是你嘗試在那裏使用原始uglify(不是gulp-uglify)。這似乎不是一個好主意,因爲uglify引用gulp-uglify,它將無法正常工作。所以最好刪除該行。

我也建議你看看official recommendation如何與醜化使用browserify和解決您的通話uglify()的順序:buffer()後,你應該把它

browserify(…) 
    .bundle() 
    .pipe(source(path.MINIFIED_OUT)) 
    .pipe(buffer()) 
    .pipe(uglify()) 
    .on('error', gutil.log) 
    .pipe(gulp.dest(path.DEST_BUILD)); 
0

好吧,所以這很奇怪 - 我會張貼任何人評論和/或更新。

按照錯誤路徑,我打開gulp-uglify下的minifier.js文件。線67(以上參考錯誤)表明這一點:

if (file.isNull()) { 
     return callback(null, file); 
    } 

    if (file.isStream()) { 
     return callback(createError(file, 'Streaming not supported')); 
    } 

問題是,則isNull和isStream不是函數 - 他們引用。因此,需要改變的代碼:

if (file.isNull) { 
     return callback(null, file); 
    } 

    if (file.isStream) { 
     return callback(createError(file, 'Streaming not supported')); 
    } 

注意去除多餘的括號 - ()。這將這些返回給它們應該是的引用,而不是js試圖調用的函數。如何將額外的()寫入isNull和isStream之間,當我的代碼運行和停止運行之間是任何人的猜測(並且有點關注) - 我沒有做出這些更改。

對於任何感興趣的人,完整的路徑解釋如下。


爲的isNull和isStream的參考文獻中index.js由這裏:

module.exports = { 
    ... 
    isStream: require('./lib/isStream'), 
    isBuffer: require('./lib/isBuffer'), 
    isNull: require('./lib/isNull'), 
    ... 
}; 

其中提到gulp-uglify -> node_modules -> gulp-util -> lib -> isNull.js (& isStream.js)下這個功能,它看起來像這樣:

module.exports = function(v) { 
    return v === null; 
}; 

所以 - 刪除函數調用minifier.js中的括號()使正確的引用和吞噬構建無誤地運行。

在一天結束時看起來像gulp-uglify問題(我猜測)。

+0

我只是感到驚訝,有一個離散模塊用於測試'null'的相等性, –