web-dev-qa-db-ja.com

Coffeescriptとの複数ファイル通信

新しいcoffeescriptファイルを作成すると、コンパイルされたコードのコードに別のファイルからアクセスできません。これは、関数スコープにラップされているためです。例えば:

CoffeeScript:

class ChatService
  constructor: (@io) ->

生成されたJavascript:

(function() {
  var ChatService;    
  ChatService = (function() {    
    function ChatService(io) {
      this.io = io;
    }    
    return ChatService;    
  })();    
}).call(this);

別のファイルでChatServiceを呼び出そうとすると、定義されていません。 Coffeescriptで複数のファイルを処理するにはどうすればよいですか?

32
Shawn Mclean

これがクライアント側のコードであるかサーバー側のコードであるかに応じて、2つのわずかに異なるアプローチがあります。

クライアント側:ここでは、次のように、ファイル全体で使用できるはずのものをグローバル名前空間(window)に添付します。

_class window.ChatService
  constructor: (@io) ->
_

次に、別のファイルでChatServiceと_window.ChatService_の両方がクラスへのアクセスを許可します。


サーバー側:ここでは、exportsrequireを使用する必要があります。 _ChatService.coffee_ファイルには、次のものがあります。

_class exports.ChatService
  constructor: (@io) ->
_

次に、別のファイルから取得するには、次を使用できます。

_ChatService = require('ChatService.coffee').ChatService
_

注:ChatService.coffeeから取得しているクラスが複数ある場合、これは、CoffeeScriptのdictunpackingが実際に優れている1つの場所です。

_{ChatService, OtherService} = require('ChatService.coffee')
_

両方:基本的に、使用している環境に基づいてサーバー側とクライアント側のどちらのコードを実行するかを選択します。一般的な方法は次のとおりです。

_class ChatService
  constructor: (@io) ->

if typeof module != "undefined" && module.exports
  #On a server
  exports.ChatService = ChatService
else
  #On a client
  window.ChatService = ChatService
_

それを取得するには:

_if typeof module != "undefined" && module.exports
  #On a server
  ChatService = require("ChatService.coffee").ChatService
else
  #On a client
  ChatService = window.ChatService
_

ChatServiceはすでにwindowにアタッチされた参照を参照しているため、2番目のブロックのelse句はスキップできます。

このファイルで多くのクラスを定義する場合は、次のように定義する方が簡単な場合があります。

_self = {}

class self.ChatService
_

次に、サーバーでは_module.exports = self_、クライアントでは_.extend(window, self)のようにアタッチします(必要に応じて__.extend_を別のextend関数に置き換えます)。

56
Aaron Dufour

通常のアプローチは、windowでグローバル名前空間を定義することです。

window.App = { }

それは、他の何かが起こる前に、アプリケーションの初期化コードのどこかに行きます。そして、あなたのクラスのために:

class App.ChatService
  constructor: (@io) ->

これにより、どこでもAppを介してクラスを参照でき、グローバル名前空間の汚染について心配する必要はありません。

chatter = new App.ChatService

ChatServiceを真にグローバルにしたい場合は、class window.ChatServiceを使用できますが、最も些細なアプリケーションを除いて、これはお勧めしません。

AFAIK、node.jsにはwindowに似たものがありますが、node.jsについては、それが何であるかを説明するのに十分な知識がありません。

24
mu is too short

クラスを名前空間で区切り、 cake を使用して、すべてを1つ(または複数)の.jsファイルにコンパイルします(s)。 Cakefileは、コーヒースクリプトをコンパイルする順序を制御する構成として使用されます。これは、大規模なプロジェクトで非常に便利です。

Cakeはインストールとセットアップが非常に簡単で、プロジェクトの編集中にvimからCakeを呼び出すだけです。

:!cake build

ブラウザを更新して結果を確認できます。

ファイルを構造化し、バックボーンとケーキと組み合わせてcoffeescriptを使用する最良の方法を学ぶのにも忙しいので、githubで smallプロジェクト)を作成しました 自分の参考として保管しておくと、ケーキやいくつかの基本的なことについても役立つかもしれません。コンパイルされたすべてのファイルはwwwフォルダーにあるため、ブラウザーで開くことができ、すべてのソースファイル(ケーキ構成を除く)はsrcフォルダーにあります。この例では、すべての.coffeeファイルがコンパイルされてone出力.jsファイルに結合され、htmlに含まれます。

0
Perica Zivkovic