Coffeescript &引用;错误:在“结束”后写入;使用咖啡时

Coffeescript &引用;错误:在“结束”后写入;使用咖啡时,coffeescript,gulp,browserify,Coffeescript,Gulp,Browserify,我只是从Browserify和Gulp开始,我在覆盖之前由Grunt和Bower覆盖的所有基础上遇到了一些问题。具体地说,我不能让这两个人一起使用咖啡。我可以轻松地使用一个工作流,首先将.coffee文件转换为.js,然后将这些文件与Browserify捆绑在一起;无论如何,我一直在执行“咖啡”任务,以检查生成的JavaScript源代码。然而,因为我确信Coffeeify已经针对这项任务进行了优化,所以我宁愿使用它 每当我尝试用Coffeify转换包时,我都会得到“错误:在结束后写入”。我试着

我只是从Browserify和Gulp开始,我在覆盖之前由Grunt和Bower覆盖的所有基础上遇到了一些问题。具体地说,我不能让这两个人一起使用咖啡。我可以轻松地使用一个工作流,首先将.coffee文件转换为.js,然后将这些文件与Browserify捆绑在一起;无论如何,我一直在执行“咖啡”任务,以检查生成的JavaScript源代码。然而,因为我确信Coffeeify已经针对这项任务进行了优化,所以我宁愿使用它

每当我尝试用Coffeify转换包时,我都会得到“错误:在结束后写入”。我试着省略扩展并在Browserify的选项中指定它;使用Browserify的内置“transform”选项(此处注释),这在Browserify的API文档中没有出现,但我在一些StackOverflow问题中看到了这一点;使用Browserify的“.add()”函数(这里也有注释),但似乎什么都不起作用。我尝试过使用coffeeify作为一个函数,带引号和不带引号

我在搜索时遇到困难,可能是因为Browserify的API处于早期阶段,因此变化很大。我已经以GitHub repo中指定的方式从命令行成功地使用了Coffeeify

var gulp = require('gulp');
var rename = require('gulp-rename');

var browserify = require('browserify');
var coffeeify = require('coffeeify');

var transform = require('vinyl-transform');

gulp.task('browserify', function() {
    return gulp.src('app/modules/main/coffee/app.coffee', {base: './'})
    .pipe(transform(function(filename) {
        return browserify({
            entries: filename,
            debug: true,
            // transform: ['coffeeify'],
            extensions: ['.coffee']
        })
        // .add(filename)
        .transform('coffeeify')
        .bundle();
    }))
    .pipe(rename(function(path) {
        path.dirname = '',
        path.basename = 'index',
        path.ext = '.js'
    }))
    .pipe(gulp.dest(''));
});

我错过了什么愚蠢的事情吗?Coffeeify不适用于乙烯基转化,我应该使用乙烯基源流吗?我点错菜了吗为什么我的Gulp任务中没有使用Coffeeify?

我没有使用Coffeeify,因此这可能不适用,但当我运行一些shell命令时,Gulp中的return命令试图在所有shell命令完成之前执行。就像第一个shell命令返回的结果很好,所以gulp尝试继续,然后第二个shell命令尝试返回,gulp说不

试试这个

var gulp = require('gulp');
var rename = require('gulp-rename');

var browserify = require('browserify');
var coffeeify = require('coffeeify');

var transform = require('vinyl-transform');

gulp.task('browserify', function() {
    gulp.src('app/modules/main/coffee/app.coffee', {base: './'})
    .pipe(transform(function(filename) {
        return browserify({
            entries: filename,
            debug: true,
            // transform: ['coffeeify'],
            extensions: ['.coffee']
        })
        // .add(filename)
        .transform('coffeeify')
        .bundle();
    }))
    .pipe(rename(function(path) {
        path.dirname = '',
        path.basename = 'index',
        path.ext = '.js'
    }))
    .pipe(gulp.dest(''));
    return gulp.src('');
});

下面是我在浏览网页时正在做的事情的简略版本。请注意,我使用的是
gulp browserify
而不是
browserify

gulp       = require 'gulp'
concat     = require 'gulp-concat'
browserify = require 'gulp-browserify'

gulp.task 'coffee', ->
    gulp.src( '_assets/js/src/**/*.coffee', read: false )
        .pipe browserify( transform: ['coffeeify'], extensions: ['.coffee'] )
        .pipe concat( 'app.js' )
        .pipe gulp.dest( '_assets/js/dist/' )
您可能不需要
concat()
,因为您只处理一个文件,因此针对特定情况的等效JS可能如下所示:

var gulp       = require( 'gulp' );
var rename     = require( 'gulp-rename' );
var browserify = require( 'gulp-browserify' );

gulp.task( 'browserify', function() {
    return gulp.src( 'app/modules/main/coffee/app.coffee', { read: false, base: './' } )
        .pipe( browserify( {
            debug: true,
            transform: ['coffeeify'],
            extensions: ['.coffee']
         } ) )
         .pipe( rename( {
             dirname: '',
             basename: 'index',
             extname: '.js'
         } ) )
         .pipe( gulp.dest( '' ) );
} );
继续使用基本
browserify
包的另一种方法是:

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

gulp.task( 'browserify', function() {
    return browserify( {
               debug: true,
               entries: ['app/modules/main/coffee/app.coffee'],
               transform: ['coffeeify'],
               extensions: ['.coffee']
        } )
        .bundle()
        .pipe( source( 'index.js' ) )
        .pipe( gulp.dest( './' ) );
} );

我还没有测试过任何一个,但希望这两个例子中的一个能为您提供帮助,或者至少能为您指明正确的方向。

看起来唯一的区别是您在最后调用
gulp.src(“”)
。更不用说它没有缩进,但没关系。请原谅,这到底有什么帮助呢?有几个开放的bug导致了这个错误()。它们的问题是,当原始src流结束时,它结束了仍在使用的可写流。因此出现了错误。通过返回单独的gulp.src,gulp将被迫等待初始命令完成,以返回新的src。我不确定这是不是解决办法,但因为你问这个问题已经快两个月了,我想你可能愿意试一试。最坏的情况是它不起作用,你被留在你开始的地方。return gulp.src(“”);现在与代码的其余部分一样缩进。好的,我将在周末尝试。在那之前我会尽力去做,但工作上我可能做不到。听起来很棒。我理解在工作中被抨击。让我知道会发生什么!