为从 Coffeescript 编译的多个串联 javascript 文件生成源映射

Question

有人在这方面取得过成功吗？

Answer 1

我认为这或多或少是一个未解决的问题： https://github.com/jashkenas/coffee-script/issues/2779。最后一条有意义的评论来自杰沃尔顿，一个月前。

不过，增加对它的支持似乎并不复杂，所以它可能很快就会到来。

Michael Ficarra（CoffeeScript Redux 的创建者）建议使用 https://github.com/michaelficarra/commonjs-everywhere .

两个注意事项：

• 它仅适用于捆绑 CommonJS 模块。
• 它使用 CoffeeScript Redux，该版本仍处于测试阶段（尽管看起来工作得很好），并且与原始 CoffeeScript 编译器不 100% 兼容。

所以这不适用于您具体要求的“串联”。

4 月 14 日添加

您可能会幸运地使用这些：combine-source-map和/或generate-sourcemap，两者均由同一作者完成。

4 月 26 日添加

这看起来非常简单：https://npmjs.org/package/mapcat。您只需向其提供由咖啡编译器生成的各个源映射文件即可。

5 月 16 日添加

Mariusz Nowak刚刚发布了webmake-coffee。与 CommonJS Everywhere 一样，它要求将代码组织为 CommonJS 模块。与各地的 CommonJS 不同，它使用常规的 CoffeeScript。

似乎Grunt Coffee-Script插件已经对串联文件提供了源映射支持相当长一段时间（两个月），有效地证明了我原来的答案是不正确的。

即将推出的 Snockets 2.0 版本也将支持它。

Answer 2

我最终选择了 browserify，使用 Coffeeify 作为转换选项，并启用 browserify 的调试选项。我在 main.js 文件的每个请求上捆绑了该应用程序，任何运行时错误都会以相当不错的准确性显示在我的原始源中。

当然比用我的眼球将连接/编译的 js 中的运行时错误映射回咖啡源更好！

Answer 3

我需要在缩小之前注释 AngularJS 代码，但是

grunt-ng-annotate

不接受输入源映射，因此我无法使用 CoffeeScript 编译器生成的映射。

显然，使用 gulp-sourcemaps 这不是问题：

var gulp = require('gulp');
var $ = require('gulp-load-plugins')(); // loading gulp plugins lazily
                                       // remember to include them in the package.json

gulp.task('appJS', function() {
  // concatenate compiled .coffee files and js files into build/app.js
  gulp.src(['./app/**/*.js','./app/**/*.coffee'])
    .pipe($.sourcemaps.init())
    .pipe($['if'](/[.]coffee$/, $.coffee({bare: true}).on('error', $.util.log)))
    .pipe($.concat('app.js'))
    .pipe($.ngAnnotate())
    .pipe($.uglify())
    .pipe($.sourcemaps.write())
    .pipe(gulp.dest('./build'))
});

同样的方法也适用于其他情况。就我而言，这是唯一有效的方法。

Answer 4

我已经编写了一个可以完美完成此任务的任务。 检查一下