0

我有许多 CoffeeScript 文件，我在转换为 Javascript 之前使用 Cakefile 连接它们。如何在文档就绪功能上使用 JQuery 包装连接的 CoffeScript 文件？

例如：

我有以下 CoffeScript 文件，每个文件都包含一个类：

foo.coffee bar.coffee 茶.coffee

为了生成 JS 文件，我使用以下 Cake 命令连接咖啡并生成 JS：

task 'build', 'Build single application file from source files', ->
  appContents = new Array remaining = appFiles.length
  for file, index in appFiles then do (file, index) ->
    fs.readFile "#{file}.coffee", 'utf8', (err, fileContents) ->
      throw err if err
      appContents[index] = fileContents
      process() if --remaining is 0
  process = ->
    fs.writeFile '../assets/js/app.coffee', appContents.join('\n\n'), 'utf8', (err) ->
      throw err if err
      exec 'coffee --compile ../assets/js/app.coffee', (err, stdout, stderr) ->
        throw err if err
        console.log stdout + stderr
        fs.unlink '../assets/js/app.coffee', (err) ->
          throw err if err
          console.log 'Done.'

这会产生我很好的 JS 文件，如下所示：

// Generated by CoffeeScript 1.3.3
(function() {

   ...all the code...

}).call(this);

我应该怎么做才能将..所有代码..包装在 JQuery on ready 函数中，如下所示：

(function() {

    $(document).ready(function() {
       ...all the code...
    });

}).call(this);

所以，基本上想要的是文档准备好后要执行的所有连接代码。

子问题我问的是正确的方法吗？我是否应该将每个 CoffeeScript 文件中包含的每个 Class 包装在一个文档就绪函数中？

非常感谢您提供任何帮助，我已经搜索了如何以及如何找到答案，但无济于事。

谢谢！

4

2 回答 2

1

首先，CoffeeScript 编译器已经有一个join命令：

-j, --join [FILE]

在编译之前，将所有脚本按照传递的顺序连接在一起，并写入指定的文件中。对于构建大型项目很有用。

$(document).ready(function () { ...} )其次，您可以直接将函数传递给$()-而不是使用，$(function () { ... });

对于您的实际问题，有几种方法可以解决。

选项1：

使用该选项编译 .coffee 文件-b / --bare，然后手动连接一个包含$(function() {开头和});结尾的文件（但这很恶心）。

选项 2：

使用类似exports = window ? this获取全局对象的方法，并将您希望在 jQuery 加载函数中运行的功能分配给该全局对象，例如：

FooModule = do ->
  class Foo 
    constructor: (@blah) ->

  init = ->
    blah = new Foo('bar')

  init: init

exports = window ? this
exports.Foo = FooModule

然后，您可以拥有另一个包含以下内容的文件：

$(->
  Foo.init()
)

希望这些选择之一是好的？

于 2013-03-19T04:21:59.970 回答
1

这里的第一个决定是是否使用coffeescript 的隔离模式，你会这样做。这封装了每个咖啡脚本文件的所有代码。您可能需要公开其中的一些代码，例如：

foo.coffee

class Foo
  a: 20
  f: () -> 
      console.log("...")

window.Foo = Foo

之后，您可以在每个文档中使用您公开的代码部分，例如：

$(document).ready(function() {
   var f = new window.Foo();
});
于 2013-03-18T20:25:45.760 回答