2

CoffeeScript と Grunt を使用する非常に大きな単一ページ アプリケーションに RequireJS を実装したいと考えています。モジュール (サービス、バックボーンなど) ごとに個別のファイルがあります。

RequireJS の実装は非常に簡単です。私の主な問題は、アプリケーションのサイズと CoffeeScript の空白の感度にあります。RJS を実装しながら、新しい機能を継続的に開発できる必要があります。これができない理由は、define 呼び出しですべてのファイルをラップし、ファイルを再タブ化する必要があるためです。このコードをリベースしようとすると、タブ移動が原因で大規模なマージ競合が発生します。RJS より前に新機能やバグ修正が導入されている可能性があるため、これらの問題をすべて解決する時間は誰にもありません。

私はいくつかの可能な解決策を調査しました：

  1. 開発を停止し、すべてを再タブします。ファイルがタブ化され、コードが実際に RJS で動作するまで開発が停止されるため、これは最悪です。

  2. CommonJS パターンを使用し、RJS 最適化前の RJS CommonJS コンバーターを使用します。ハッキーなようです。

  3. CoffeeScriptbacktick機能を使用して、標準の JavaScript モジュール パターンで CoffeeScript クラスをラップします。次に、CoffeeScript クラスの「モジュール」ラッパーに依存関係を渡し、ファイルの RJS 呼び出し内で「モジュール」を初期化します。

編集：垂直構造に関するヒントと、関数の引数をそのように渡す方法（コンマなし）を紹介してくれてありがとう。私たちのプロジェクトは構造が非常に似ています (残念ながら現時点では grunt-contrib-coffeee が lint を実行することを除いて)、単一のファイルをコンパイルするためのカスタム ウォッチ タスクも作成しています (vs. glob パターン)。

この非常に基本的な例を考えてみましょう:

view.coffee:

class View
  template: Helper.template
  constructor: (@options) ->
  render: (meters) ->
    $('body').html @template @options

通常のプロセスは、RJS で次のようなことを行うことです。

define [
  'jQuery'
  'Helper'
], (
  $
  Helper
) ->
  class View
    template: Helper.template 'base_view'
    constructor: (@options) ->
    render: (meters) ->
      $('body').html @template @options

クラス全体がどのように再タブ化されているかに注目してください。View私がrequireを並行して実装しようとしているときに、開発者の誰かがやって来てクラスを変更した場合、Gitはこれを嫌うでしょう。

バックティックのアイデアは機能しません。グローバルな問題を回避できません。

`var exports = function($, Helper) {
class View
  template: Helper.template
  constructor: (@options) ->
  render: (meters) ->
    $('body').html @template @options
return View }(jQuery, Helper)`

define [
  'jQuery'
  'Helper'
], (
  $
  Helper
) ->
  return exports($, Helper)

私の最善の策は、すべてのアプリケーション機能をまとめてマージし、すべてのファイルに必要な 2 つのスペースをすべて 1 つのコミットで再タブ化するために一時停止することだと思います。ファイルの残りの部分がそのパターンに従っている限り、CoffeeScript はインデントの開始位置 (列 0 と列 2) を気にしないようです。このように、RJS をスライドインして段階的に実装し、解決できないマージの競合を防ぐことができるはずです。

4

1 に答える 1

0

プロジェクトで行うこと:

  • コーヒーファイルのコンパイルと検証には、 grunt-contrib-coffeeとgrunt-coffeelintを使用します。このプラグインを使用すると、開発中に coffeescript コードを検証できます。検証設定を含む json ファイルを使用できます。これにより、すべての開発者が同じ設定を使用できるようになります。

例えば：

{
  "no_tabs" : {
    "level" : "error"
  },

  "no_trailing_whitespace" : {
    "level" : "error"
  },

  "max_line_length" : {
    "value": 200,
    "level" : "error"
  },
  ...
  • 各依存関係を別々の行で定義することにより、requirejs 依存関係でのマージの競合の可能性を最小限に抑えます。

例えば

define [
 'dep1'
 'dep2'
 'dep3'
], (
  dep1
  dep2
  dep3
) -> 
  console.log "Hello"

それ以外の

define ['dep1', 'dep2','dep3'], (dep1, dep2, dep3) -> 
  console.log "Hello"
  • ソース管理には、coffeescript ファイルのみをコミットします。生成された JavaScript ファイル ( grunt-contrib-requirejs で縮小) はコミットしません (製品版を作成する場合のみ)。
  • カスタム監視タスクを使用して、変更された coffeescript ファイル (他のファイルの中でも) を監視します。コンパイルまたは検証が失敗した場合、うなり声を介して開発者に通知されます。
于 2014-02-28T08:11:31.790 に答える