組織多個CoffeeScript文件

我正在研究一個Web服務的實現，我們正在使用CoffeeScript編寫我們的前端代碼。我偶然發現的問題是，當項目越來越多時，功能必須在不同的文件中分離。我真正需要的是一個簡單的結構，其中在utils.coffee文件，我將有哪些是從每一頁所需的基本功能，並在每個獨立的文件，我將有page_foo.coffeepage_bar.coffee的特定功能。我怎樣才能正確構建它，所以我也確保utils.coffee首先加載，並且可以從每個人都可以訪問？組織多個CoffeeScript文件

來源

2012-01-07 topless

這不是特定於CoffeeScript，而是JavaScript的一般問題。這是說...看到[「構造咖啡代碼？」]（http://stackoverflow.com/questions/6150455/structuring-coffeescript-code），特別是我的答案[這裏]（http://stackoverflow.com /問題/ 6150455 /結構，CoffeeScript的代碼/ 8303780＃8303780）。 – shesek 2012-01-07 12:49:54

你可以檢查它是如何在gae-init完成項目（免責聲明：我的創造者）。

其基本思想是將所有*.coffee文件放在一個特定目錄中，然後生成一個編譯所有文件並將其放入正確路徑的構建腳本。

由於您希望能夠在調試過程中輕鬆進行調試，因此構建腳本應該有一個選項來編譯它們，以及另一個選項來組合它們。

來源

2012-05-02 16:06:19 Lipis

謝謝我改變了我的答案，只因爲它的迷人。它不僅提供了咖啡性能優化的結構，而且還提供了我常用的一大堆工具。 – topless 2012-05-02 17:58:44

我甚至不知道你可以「不接受」答案:)如果你走這條路線，你應該看一下CoffeeScript自己的[cake]（http://coffeescript.org/#cake）實用程序（少一種語言然後） – 2012-05-04 06:57:44

這是一個好主意，但它可以防止你有兩個相同名稱的文件，比如說views/navItem和models/navItem – dezman 2014-01-09 17:09:36

執行順序推崇的瀏覽器，所以只包括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'

來源

2012-01-09 06:22:53

用於require.js的+1 - 它對我們非常有用。 – domenukk 2013-06-30 14:27:31

我要做的就是寫一個蛋糕任務按照預定的順序加入和編譯文件，例如

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

來源

2012-01-11 07:59:15 jaime

隨着CoffeeToaster你必須包括你需要他們的頂部文件的能力，確保您的最終「.js」文件（也將合併您的所有CoffeeScript文件）將按照正確的順序排列，供瀏覽器內部使用。

採取的文檔看：
http://github.com/serpentem/coffee-toaster

它還配備了一個包裝系統，該系統啓用時會使用你的文件夾的層次結構，如果你想使空間中聲明你的類，那麼你可以extends類從多個文件，做進口和兒子，比如像：

#<< 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'

甚至有一個調試選項可單獨編譯文件以簡化調試過程和其他有用的功能。

來源

2012-04-26 19:07:29

如何顯示覆雜的命名空間acme.sales.admin，這是我的應用程序的根？ – 2012-07-11 21:31:06

您可以相互創建這些文件夾，並將文件放在「acme/sales/admin/yourfile.coffee」中。 – 2012-10-25 17:11:23

CoffeeToaster已經[已停用]（https://github.com/arboleya/coffee-toaster/wiki）並分發給一個新項目[Polvo]（https://github.com/polvo/polvo）。 – 2017-06-13 20:13:10

組織多個CoffeeScript文件

回答

相關問題