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

Question

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

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

Answer 1

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

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

Answer 2

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

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

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

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

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

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

Answer 3

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

Answer 4

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

Для нового проекта я попробовал browserify. Это великолепно! И если вы используете 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']

Answer 5

Для управления зависимостями на стороне клиента я использую requirejs для исходного кода javascript и coffeescript. Возможно использовать плагин requirejs для загрузки собственных файлов кофе, но я предпочитаю «скомпилировать» в js.

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

Что-то мне очень нравится в requirejs, оно «продвигает» создание модуля и объявляет явные зависимости.

# 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())
)