Проблема с объединением нескольких файлов JavaScript

Question

Это полный вопрос, но я все равно должен его задать

Я начал играть с backbone.js несколько дней назад и был действительно очарован.Когда я закончил «ToDo», я начал работать над собственным проектом.Исходя из мира Java, я предпочитаю хранить все как можно больше отдельных файлов.Поэтому я разделяю представления моделей и маршрутизаторы на отдельные файлы в отдельные папки.

Проблема возникла, когда я попытался объединить эти поля в один файл applciation.js.Опять же, выходцы из мира Java, мне нравится, когда я могу автоматизировать вещи, и даже больше, когда я могу использовать знакомые инструменты, такие как ant, для настройки процессов сборки для своих проектов javascript.

Я получил пример сборки antШаблон, который объединяет и минимизирует все файлы в произвольном порядке.Когда оно закончилось, я попытался запустить свое приложение JS, и неудивительно, что оно провалилось с кучей ошибок.Многие из моих моделей и представлений пытаются расширить друг друга, другие зависят от них как от компонентов.Если они не определены в правильном порядке, приложение просто достигает точки, где оно пытается выполнить extend из undefined

. Я знаю, что для JavaScript порядок очень важен, нопочему-то у меня сложилось впечатление, что если все сценарии находятся в одном файле, JS-анализатор сначала загрузит все содержимое, а затем попытается выполнить все, что должно быть выполнено.Ну, мое предположение было неверным.

Можно перечислить все файлы в определенном порядке, я хочу их, но действительно ли мне нужно идти на такой примитивный шаг?К сожалению, потратив несколько часов на исследования, я не смог найти ничего лучшего.

Действительно ли возможно объединять файлы JS, которые зависят друг от друга, в произвольном порядке, без их коллизий?Я думаю, самая большая проблема заключается в том, что функция extend фактически вызывается, а не каждый скрипт, просто определяющий и объектный литерал

Итак, каково решение?

ОБНОВЛЕНИЕ : Я только что видел, что у Sproutcore есть свой собственный строитель.Если SC похож на BB, то, как он создает и расширяет сущности, как компоновщик SC работает без столкновений?

Answer 1

Взгляните на requirejs . Для настройки требуется некоторое время, но это должно помочь вам решить вашу проблему.
Эта статья должна помочь с реализацией.

Answer 2

Есть много способов сделать это, но вот мой рецепт.Я префикс своих файлов разработки с номером, начиная с файла без зависимостей (базовые «классы», модели, которые будут зависеть от других моделей, затем представления, использующие эти модели, затем маршрутизаторы, вызывающие эти представления и т. Д.).

Затем я использую uglify-js (доступный как библиотека node.js, которую вы устанавливаете с помощью npm install uglify-js), чтобы минимизировать все мои js в одном файле (не знаю по вашему вопросу, используете ли вы сервер node.js)со стороны, хотя).Тогда я cat *.js | uglifyjs -o min/myfile.min.js.Это отправит содержимое всех моих файлов .js (с учетом порядка зависимостей из-за моего префикса) в uglify, что сведет его к минимуму и сохранит в одном файле.

Поскольку я тоже люблю автоматизациюЯ настроил это в Makefile, хотя я думаю, что это можно сделать с помощью Ant (не слишком знаком с ним).Соответствующая часть Makefile выглядит следующим образом:

TARGET_MIN_FILE = public/js/min/myfile.min.js
JS = $(shell echo public/js/*.js)


public/js/min/myfile.min.js: $(JS)
    cat $(JS) | uglifyjs -o $(TARGET_MIN_FILE)


clean:
    rm -f $(TARGET_MIN_FILE)

.PHONY: clean

С другой стороны, если вы выбираете формат определения асинхронного модуля (AMD), вы можете потребовать () ваши модули, и он будет управлять вами.загрузка зависимостей в правильном порядке (см. Require.js для получения дополнительной информации), как упомянуто TheShelfishMeme.

Answer 3

Ваше «предположение» верно только для var операторов и функций вида function name(a,b) {}.Эти два поднимаются в верхнюю часть скрипта (или функционального блока, в котором они находятся) и оцениваются первыми.

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