Question

我正在开发一个Web服务的实现，我们正在用CoffeeScript编写前端代码。我偶然发现的问题是，当项目增长时，功能必须在不同的文件中分开。我真正需要的是一个简单的结构，在utils.coffee文件中，我将拥有每个页面和每个单独文件所需的一般函数，我将具有page_foo.coffee page_bar.coffee特定函数。我如何正确地构建它以便确保utils.coffee首先加载并且可以从每个人访问？

Answer 1

使用CoffeeToaster，您可以在其顶部包含您需要的文件，确保您的最终“.js”文件（也将是所有CoffeeScript文件的合并）具有适当的一切订购，在浏览器中使用。

查看文档：
http://github.com/serpentem/coffee-toaster

它还带有一个打包系统，如果你愿意的话，在启用时会使用你的文件夹的层次结构作为你的类的命名空间声明，然后你可以从多个文件扩展类，执行import和son，例如：

#<< another/package/myclass
class SomeClass extends another.package.MyClass

构建配置极简主义：

# => SRC FOLDER
toast 'src_folder'
    # => VENDORS (optional)
    # vendors: ['vendors/x.js', 'vendors/y.js', ... ]

    # => OPTIONS (optional, default values listed)
    # bare: false
    # packaging: true
    # expose: ''
    # minify: false

    # => HTTPFOLDER (optional), RELEASE / DEBUG (required)
    httpfolder: 'js'
    release: 'www/js/app.js'
    debug: 'www/js/app-debug.js'

甚至还有一个单独编译文件的调试选项，以便于调试过程和其他有用的功能。

Answer 2

执行顺序在浏览器上受到尊重，因此请先包含utils.js。

像CodeKit这样的工具（http://incident57.com/codekit/）可以编译和缩小+将所有.coffee文件加入一个.js，这也很容易用shell脚本做

如果您的应用非常庞大，请阅读require.js和Asynchoronous Module Loading。它将允许您非常轻松地管理依赖关系，并且只加载必要的内容：

# page_foo.coffee
define ['lib/utils'], ($) ->
    // code that uses 'utils'

Answer 3

你可以在gae-init项目中查看它是如何完成的（免责声明：我是创作者）。

基本思想是你在一个特定目录中拥有所有*.coffee个文件，然后是一个构建脚本，它编译所有文件并将它们放在正确的路径中。

由于您希望能够轻松地进行调试，因此在构建脚本时，构建脚本应该有一个选项来编译它们，另一个选项是组合＆amp;缩小它们。

Answer 4

我所做的是编写一个Cake任务，以预定的顺序连接和编译文件，例如

task 'build', 'join and compile *.coffee files', ->
  exec "coffee -j #{outJS}.js -c #{strFiles}", exerr

其中outJS是我想要编译的JavaScript的文件名，strFiles是一个文件名字符串

此外，您可以使用YUICompressor或您喜欢的工具添加任务以缩小编译的代码。在开发过程中观看，加入，编译也可以自动化

task 'watch', 'watch and compile changes in source dir', ->
  watch = exec "coffee -j #{outJS}.js -cw #{strFiles}"
  watch.stdout.on 'data', (data)-> process.stdout.write data

查看this gist

组织多个CoffeeScript文件

4 个答案: