Переход на модульный подход к написанию JavaScript, к сожалению, является более сложным процессом, чем мы могли бы надеяться. Как только вы поймете концепцию AMD, вам нужно будет разобраться в логистике: как настроить RequireJS? А как насчет не-AMD библиотек? Как насчет управления зависимостями? Как насчет конфигурации и оптимизации?
Используя этот стартовый шаблон
Репозиторий для видеоруководства должен стать отличной отправной точкой для начала новых проектов RequireJS + Backbone. Как только вы освоитесь с процессом, также, в какой-то момент, обязательно рассмотрите Yeoman с поддержкой RequireJS.
Быстрая установка
Сначала, конечно, скачайте этот репо . Затем из Терминала (при условии, что Node.js установлен) установите RequireJS.
1
|
npm install requirejs
|
Далее нам нужен простой способ справиться с управлением зависимостями. Мы будем использовать Bower от ребят из Twitter.
1
|
npm install bower
|
Давайте теперь установим зависимости для этого проекта. Я предполагаю, что мы создаем проект Backbone, поэтому я перечислил RequireJS, jQuery, Underscore и Backbone в качестве зависимостей.
1
|
bower install
|
Обратите внимание, что мы используем версии AMD для Backbone и Underscore, чтобы максимально упростить процесс установки.
Когда будете готовы построить проект, запустите:
1
|
build/build.sh
|
это создаст новый каталог `dist`, скопирует файлы, запустит оптимизатор r.js
для ресурсов и немного очистит его файловую структуру для производства. Обратитесь к app.build.js
для параметров конфигурации.
CSS Импорт
Если вы не используете препроцессор, не стесняйтесь модулировать ваши таблицы стилей и @import
их в главную таблицу стилей. В процессе сборки r.js
объединит эти файлы, так что вам не придется беспокоиться о каких-либо @import
производительности при использовании @import
.