Управление зависимостями на стороне клиента в CoffeeScript

Каков наилучший способ сделать Dependency Management среди файлов CoffeeScript, если в конечном итоге файлы javascript в конечном итоге должны быть объединены вместе для использования на стороне клиента?

Для серверной стороны CoffeeScript я могу просто использовать ключевое слово "require", чтобы потребовать другие части javascript. Когда это скомпилировано для приложений на стороне клиента, чтобы иметь дерево зависимостей, на основе требуемого, вычисленного и объединенного автономного файла javascript. Есть ли способ сделать это в общем?

Ответ 1

Другим вариантом является использование CoffeeToaster, который использует другой подход, чем внедрение шаблонов модулей AMD/CJS.

Посмотрите: http://github.com/serpentem/coffee-toaster

Ответ 2

Обычно для клиентской упаковки JavaScript (и CSS) требуется какой-то плагин для упаковки активов. Мы используем Jammit, но есть много других опций: Sprockets, Django-Compress... и многое другое.

Ответ 3

Villain (движок игры CoffeeScript для браузеров) определяет функции, которые выполняют именно это (управление зависимостями и js-конкатенация).

Код для этих двух файлов:

cake.coffee, см. determineDependencies(), wrapModule() и bundleSources()
brequire.coffee, требуется замена браузера для использования с wrapModule()

Я использую его здесь (см. задачу 'bundle' Cake).

Примечание. Я просто объявляю каталог сборки модуля 'main', а Villain просматривает мои скомпилированные JS файлы для создания дерева зависимостей (начиная с index.js), затем создает файл с пакетом JavaScript, содержащий замену Villain require и все мой соответствующий код отсортирован и правильно упакован.

Автор Villain использует его в orona, игре в CoffeeScript, сделанной с помощью Villain.

Ответ 4

Для управления зависимостями на стороне клиента я использую requirejs для источника javascript и coffeescript. Нельзя использовать плагин requirejs для загрузки файлов файлов, но я предпочитаю "компилировать" в js.

requirejs также предоставлять/работать с r.js optimizer. Он может использоваться для объединения набора файлов js в один и его минимизации. вам не нужно указывать файл для агрегирования, это определение зависимости каждого модуля требуется вашим "main.js". (функция, соответствующая вашему запросу)

Что-то, что мне очень нравится с requirejs, это "promots", создающий модуль и объявляющий явные зависимости.

# A.coffee
define(() ->
  class A
    constructor: (@c1, @c2) ->
      @c2 ?= 1

    m1 : () ->
      "hello"

    toString : () -> "#{@c1}#{@c2}"
)


# B.coffee
define(['A'], (A) ->
  a = new A(33)
  console.log(a, a.m1())
)

Ответ 5

Я использовал (и, я думаю, все еще использую) requirejs, но я начал находить его довольно неуклюжим. Многие мои файлы в конечном итоге имеют ~ 10-12 импорта наверху, которые просто занимают много места и не выглядят великолепно.

Для нового проекта я попробовал браузеру. Это здорово! И если вы используете grunt (вы должны), вы можете сделать задачу просмотра, чтобы прокрутить код при изменении. grunt-browserify также обеспечивает возможность преобразования coffeescript.

https://github.com/jmreidy/grunt-browserify

Итак, ваша задача с часами в вашем Gruntfile.coffee будет выглядеть примерно так:

watch:
  files: [
    "app/**/*.coffee"
  ]
  tasks: "browserify"

browserify:
  'build/app.js': ['app/**/*.coffee']
  options:
    transform: ['coffeeify']