2015-05-15 22 views
0

我是Browserify的初學者。我試圖將它與Watchify(出於性能原因)和Coffeeify整合到gulp.js中。我嘗試了至少五種在Google中發現的不同方法,其中最後一個是來自gulp文檔的an official recipeCoffeeify不會解析超過入口文件

問題現在是轉換的一部分。我想用Coffeeify來解析我的代碼,這些代碼主要是用CoffeeScript編寫的。

Coffeeify成功解析我錄入文件app.coffee但是當我需要從那裏./foo.coffee,該文件似乎並沒有被改變,這將自然導致由Browserify意想不到的令牌等

任何人有一個想法,分析錯誤如何解決這個問題?

下面是我的gulpfile的相關部分,大部分與上面的鏈接相同,只是增加了轉換。

var gulp = require('gulp'); 
var gutil = require('gulp-util'); 

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


var b = watchify(browserify({ 
    entries: [ './coffee/app.coffee' ], 
    extensions: [ '.coffee' ], 
    debug: true, 
    cache: false, 
    packageCache: false 
})); 
b.transform(coffeeify); // as described in the gulp docs 

gulp.task('bundle', bundle); 
b.on('update', bundle); 
b.on('log', gutil.log); 

function bundle() { 
    return b.bundle() 
     .on('error', gutil.log.bind(gutil, 'Browserify Error')) 
     .pipe(source('bundle.js')) 
     // I actually tried to pipe in coffeeify here (gulp-coffeeify as well), didn't help 
     .pipe(gulp.dest('./js')); 
}; 
+0

我試過你的設置,對我來說似乎沒問題(乙烯來源來源是'vinyl-source-stream') - 你的文件夾結構怎麼樣? – ddprrt

+0

哦,是的,這是我的錯字,對不起。那麼,文件夾結構實際上看起來有點不同於我在代碼中描述的結構,我簡化了一下。但我認爲這並不重要,因爲gulp顯然可以找到app.coffee所需的一切。原始結構看起來像/source/coffee/app.coffee,/source/coffee/foo.coffee,/ dist/js,/gulpfile.js – Loilo

+0

錯誤看起來像這樣:'foo.coffee'以一個類定義開始,像這樣:'class Foo \ n defaults: - > // do stuff \ n ...',而且自然地,「defaults」被識別爲「意外標記」。 ('\ n'當然是換行符。) – Loilo

回答

0

好吧,這完全是我的錯。我抽象我的代碼有點過頭了這個職位因此未在這裏反映的實際問題: app.coffeenode_modules目錄確實不實際上直接要求./foo.coffee但需要foo/foo,只是爲了讓事情變得更容易。 這恰好是問題所在:轉換將不適用於所需的。這是intended behavior

似乎有是圍繞兩個方面:

解決方案1:所謂global-transform一個browserify選項。 在API中,它的使用類似於b.transform(coffeeify, { global: true })。這將對每個需要的模塊應用coffeeify變換。

解決方案2:轉換包的明確定義。這意味着:添加這樣的事情每個模塊的package.json:

{ 
    "browserify": { 
     "transform": ["coffeeify"] 
    } 
} 

我決定用第一種,因爲我的‘套餐’其實甚至沒有一個文件的package.json,他們只是在node_modules目錄中可以通過browserify輕鬆訪問。