Javascript-форум (https://javascript.ru/forum/)
-   Ваши сайты и скрипты (https://javascript.ru/forum/project/)
-   -   Site builder. (https://javascript.ru/forum/project/25248-site-builder.html)

B~Vladi 30.01.2012 13:39

Site builder.
 
Хочу рассказать о своей последней разработке - Site builder.
Это сборщик, позволяющий преобразовывать исходники сайта (проекта). Создан на базе Ant-а, поэтому для его работы нужна Java и, собственно, сам Ant. Так как база кроссплатформена, сборщик может работать на любой системе.

За конкретные преобразования отвечают модули, управляемые ядром. На данный момент реализовано 2 модуля - это компрессоры JS и CSS. В будущем возможности будут расширяться. К примеру, следующими модулями будут генерация JSDoc и сборка спрайтов. Вообще, возможности Ant-а довольно большие и практически любую задачу можно реализовать в модуле.

Для интеграции сборщика в проект необходимо провести его базовую настройку. Речь идет об общем конфигурационном файле сборщика. Приведу пример:
{
	"libraries": { // Подключение библиотек, необходимых для работы модулей.
		"JSON": { // Имя библиотеки
			"language": "javascript", // Язык сценария библиотеки.
			"src": "JSON.js" // Путь к файлу относительно папки lib.
		}
	},
	"modules": { // Подключение необходимых модулей.
		"JS Compressor": { // Имя модуля
			"src": "JS Compressor/build.xml", // Путь к файлу сценария сборки Ant относительно папки modules. Данный файл является входной точкой запуска модуля.
			"configs": ["path/to/config.json"], // Список путей относительно корня модуля к конфигурационным файлам модуля. Может быть в любом формате - это уж как будет реализовано в модуле.
			"depends": ["CSS Compressor"] // Список имен модулей, которые необходимо выполнить перед вызовом текущего. Необязательный параметр.
		},
		"CSS Compressor": {
			"src": "CSS Compressor/build.xml",
			"configs": ["path/to/config.json"]
		}
	}
}

Пути к папкам модулей, библиотек и т.д. указаны в файле build.properties относительно корня модуля.

Для сжатия JS используется гугловый компилятор, для CSS - YUI Compressor.

Далее необходимо создать конфиги модулей. Как я писал выше - каждый модуль требует создания конфига со своим форматом, параметрами и их значениями. Конфиги существующих модулей похожи:
{ // Конфиг модуля JS Compressor
	"sourceDir": "src", // Корень ресурсов относительно расположения этого конфига
	"destinationDir": "output", // Корень сжатых файлов
	"gZipped": true, // Нужно ли создавать файлы .gz рядом со сжатыми файлами.
	"compile": "simple", // Уровень компиляции для всех файлов. Может быть false, что означает без сжатия.
	"files": { // Список создаваемых файлов.
		"base.js": { // Имя результирующего файла. Можно указывать, например, так: path/to/base.js. Это означает, что результирующий файл будет находиться в {путь к этому конфигу}/output/path/to/base.js
			"compile": "advanced", // Уровень компиляции конкретно для этого файла
			"includes": ["base/"], // Файлы-источники. В данном случае будут слиты в один файл все файлы из папки src/base/. Можно указывать по маске, например "*.js".
			"excludes": ["base/*.min.js", "otherFileName.js"], // Файлы, которые не будут включены в результирующий.
			"caseSensetive": true // or false. Учитывать ли регистр включаемых и исключаемых файлов.
		}
	}
}

Как видно - всё достаточно гибко. Конфиг модуля CSS Compressor точно такой же, за исключением того, что параметр compile может иметь значения только true или false.

После настройки, сборщик можно запускать. Есть несколько различных способов: через GUI в среде разработки или из коммандной строки. В обоих случаях необходимо устанавливать параметр с именем "path.config", значением которого должен быть путь к общему конфигурационному файлу. Файлом сценария сборки Ant-а является build.xml из корня сборщика. Пример запуска:
Код:

ant  -buildfile path/to/build.xml -Dpath.config path/to/config.json
Цель по-умолчанию называется build и запускает все модули, определённые в общем когфиге. Если необходимо запустить определённый модуль, это можно сделать несколькими способами:
1. Через цель Run module:
Код:

ant  -buildfile path/to/build.xml -Dpath.config path/to/config.json "Run module"
При этом будет выдан запрос на ввод имени модуля (в консоли или через GUI). Стоит обратить внимание, что этим способом можно запустить только один конкретный модуль (включая зависимые). Что бы запустить несколько - воспользуйтесь вторым способом.
2. Через указание имен модулей в качестве целей:
Код:

ant  -buildfile path/to/build.xml -Dpath.config path/to/config.json "JS Compressor" "CSS Compressor"
Модули будут вызваны в указанном порядке.

Важный момент: если для вызываемого модуля указаны зависимые модули через параметр depends, они так же будут выполнены перед текущим.

Ссылка на исходники: https://github.com/B-Vladi/Site-builder
Буду рад любым вопросам, предложениям, замечаниям, критике :)

PS: сори за "многобуков".

float 30.01.2012 13:50

:) лол. Почти одновременно.
Только чуть подходы разные(как я понял у вас инфа о включениях в отдельном файле, а у меня в фалах проекта)
+ я исключил поддержку css(тк для этого синтаксис директив пришлось бы переводить на цсс коммент копатибл, а мне такой стиль не нравиться чисто визуально:))[ну и вообще всего что не поддерживает // комментарий].
зы сорри если я мб чегот не допонял.

B~Vladi 30.01.2012 14:55

Цитата:

Сообщение от float
как я понял у вас инфа о включениях в отдельном файле, а у меня в фалах проекта

Модули JS и CSS сборки не работают с отдельными частями кода. Сейчас есть возможность склеивать, компилировать и архивировать только целые файлы. Хотя это вполне реализуемо, надобности я пока не вижу. Если будут просьбы на такой функционал - сделаю.

float 30.01.2012 15:22

Я имел ввиду что у вас инфа о компонентах хранится в билд файле, а у меня есть понятие стартовой точки + инфа о подключаемых файлах в самих фалах.
Я вообще-то с антом не очень знаком. Не очень понял всё-таки: вы собрались собирать скрипты сервер сайда в 1-н файл или файлы которые клиенту отдаются или мб и то, и то?

B~Vladi 30.01.2012 15:53

Цитата:

Сообщение от float
у вас инфа о компонентах хранится в билд файле

У меня инфа хранится в конфигах, а где будут храниться они - не важно. Это кому как удобнее. Поэтому ты и не видишь конфиги в исходниках (папка example - для примера).
У меня стартовая точка + инфа о задачах, которые необходимо выполнить (основной конфиг) + настройки этих самых задач (модулей). На один модуль может приходится несколько разных настроек (разных конфигов).
Цитата:

Сообщение от float
вы собрались собирать скрипты сервер сайда в 1-н файл или файлы которые клиенту отдаются или мб и то, и то?

Это уже кому что надо. Server-side скрипты в сборке (сжатии) не нуждаются, как правило.

Не только программным кодом ограничена область применения. Как я уже говорил - это может быть генерация документации, преобразование изображений (спрайты, добавление водяных знаков), можно даже сделать коммит по SSH в удалённый репозиторий. Возможности модулей ограничены только возможностями Ant-а и вашей фантазией. А если возможностей анта будет не достаточно - можете написать свою либу на Java.
Можно написать модуль, преобразующий урлы в тегах script/link с исходных файлов на сжатые и наоборот в html-шаблонах. Хотя для этого лучше использовать шаблонизатор.

B~Vladi 30.01.2012 18:47

Обновил код.
Добавлен модуль JSDoc (думаю, всем всё понятно). Как будет время - сделаю подробное описание по сборщику и отдельно по модулям.

B~Vladi 07.02.2012 22:21

Up. Добавился JSHint.
Понимаю что без хорошей документации никак. Исправлюсь.

B~Vladi 04.03.2012 13:54

Up.
Сборщик достиг стадии 1.0! :victory:
Можно ознакомится с документацией на гитхабе: https://github.com/B-Vladi/Site-builder

Сборщик тестировался на двух совершенно разных проектах и во всех случаях отлично интегрировался в их среды.

В будущей версии 1.1 появится модуль SpritePacker ;)


Часовой пояс GMT +3, время: 12:42.