Trình duyệt không tạo được gói có chuyển đổi babelify (TypeError: Đường dẫn phải là một chuỗi.)

Question

Tôi đã viết một tác vụ gulp để biên dịch các tập lệnh .jsx và .js thành một gói bằng cách sử dụng watchify và babelify làm biến đổi. Đối với một số lý do kịch bản ngụm của tôi dường như bị nghẹt thở trên biến đổi và tôi không chắc chắn lý do tại sao:

gulp.task('browserify', function() { 
    var bundle = watchify(browserify('./app/jsx/client/index.jsx', { 
    extensions: ['.js', '.jsx'], 
    debug: process.env.NODE_ENV === 'development' 
    })); 
    bundle.transform(babelify); 
    bundle.on('update', function() { 
    rebundle(bundle); 
    }); 


    function rebundle(bundle) { 
    return bundle.bundle() 
    .on('error', function(error) { 
     console.log(error.stack, error.message); 
     this.emit('end'); 
    }) 
    .pipe(
     gulpif(
      (process.env.NODE_ENV == 'production'), 
      require('gulp-rename')('bundle.min.js'), 
      require('gulp-rename')('bundle.js') 
     ) 
    ) 
    .pipe(gulpif((process.env.NODE_ENV == 'production'), buffer())) 
    .pipe(gulpif((process.env.NODE_ENV == 'production'), uglify())) 
    .pipe(gulp.dest('dist/js')); 
    } 

    return rebundle(bundle); 
}); 

Trong giao diện điều khiển ...

path.js:8 
    throw new TypeError('Path must be a string. Received ' + 
    ^

TypeError: Path must be a string. Received undefined 
    at assertPath (path.js:8:11) 
    at Object.posix.join (path.js:480:5) 
    at Transform.stream._transform (/home/zipp/search-admin/node_modules/gulp-rename/index.js:52:22) 
    at Transform._read (_stream_transform.js:167:10) 
    at Transform._write (_stream_transform.js:155:12) 
    at doWrite (_stream_writable.js:292:12) 
    at writeOrBuffer (_stream_writable.js:278:5) 
    at Transform.Writable.write (_stream_writable.js:207:11) 
    at Readable.ondata (/home/zipp/search-admin/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) 

Answer 1

lỗi Đó là bởi vì bạn cần một vinyl-source-stream trong đó. Kết quả của .bundle() là luồng Node chuẩn của dữ liệu tệp. Bạn đang lấy dữ liệu đó đang chuyển dữ liệu đến số rename, dự kiến ​​một luồng của đối tượng Gulp File.

var source = require('vinyl-source-stream'); 

// stuff 

    function rebundle(bundle) { 
    return bundle.bundle() 
    .on('error', function(error) { 
     console.log(error.stack, error.message); 
     this.emit('end'); 
    }) 
    .pipe(
     gulpif(
      (process.env.NODE_ENV == 'production'), 

      // Use 'source' here instead, which converts binary 
      // streams to file streams. 
      source('bundle.min.js'), 
      source('bundle.js') 
     ) 
    ) 
    .pipe(gulpif((process.env.NODE_ENV == 'production'), buffer())) 
    .pipe(gulpif((process.env.NODE_ENV == 'production'), uglify())) 
    .pipe(gulp.dest('dist/js')); 
    } 

Thay vì sử dụng rename, bạn có thể sử dụng source để xác định tên gọi ban đầu của tập tin.