<p align="right">
<a href="README.md">English description</a> | Описание на русском
</p>

# ![Tars](https://raw.githubusercontent.com/artem-malko/artwork/master/tars/logo.png)

[![Mac/Linux Build Status](https://img.shields.io/travis/tars/tars/master.svg?label=Mac%20OSX%20%26%20Linux&style=flat-square)](https://travis-ci.org/tars/tars) [![Windows Build status](https://img.shields.io/appveyor/ci/artem-malko/tars/master.svg?label=Windows&style=flat-square)](https://ci.appveyor.com/project/artem-malko/tars/branch/master) [![Dependency Status](https://david-dm.org/tars/tars.svg?style=flat-square)](https://david-dm.org/tars/tars) [![Gitter](https://badges.gitter.im/Join%20Chat.svg?style=flat-square)](https://gitter.im/2gis/tars?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge)

Сборщик html-верстки, основанный на [gulp](http://gulpjs.com/). Облегчает и ускоряет процесс html-верстки любой сложности.
Подойдет как командам, так и отдельному разработчику. TARS решает большинство рутинных дел, связанных с версткой, чтобы вы получали больше удовольствия от работы.

TARS — сборщик-фреймворк, включающий в себя набор gulp-тасков, предоставляющий возможность легкого расширения (создания новых тасков) и модифицирования уже существующих.
TARS предоставляет удобную архитектуру хранения тасков и вотчеров в проекте.

Для того, чтобы не скачивать и не ставить все пакеты для TARS каждый раз, был создан [TARS-CLI](https://github.com/tars/tars-cli). Сам TARS — не npm-пакет. Такое решение было принято, чтобы каждый мог максимально комфортно кастомизировать сборщик под себя. CLI — просто удобный интерфейс над сборщиком, который содержит в себе все зависимости для TARS.

**Желательно пользоваться именно CLI-версией для разработки.**

Вы можете установить TARS-CLI через npm. Больше информации в [репозитории проекта](https://github.com/tars/tars-cli).


## Основные фичи

Ниже перечислена только малая часть особенностей, на самом деле их гораздо больше)

* [Jade](http://jade-lang.com/) или [Handlebars](http://handlebarsjs.com/) на выбор в качестве html-шаблонизатора. Также можно использовать обычный html. Подробности [здесь](/docs/ru/html-processing.md).
* Использование json (а точнее js-объекта, который может быть описан в json) для передачи данных в шаблоны (опционально, но очень крутая штука, которая позволит избавиться от копипаста). Подробнее [тут](/docs/ru/html-processing.md#%D0%A0%D0%B0%D0%B1%D0%BE%D1%82%D0%B0-%D1%81-%D0%BC%D0%BE%D0%B4%D1%83%D0%BB%D1%8F%D0%BC%D0%B8-%D0%B8-%D0%B4%D0%B0%D0%BD%D0%BD%D1%8B%D0%BC%D0%B8-%D0%B2-handlebars).
* Вы можете ипользовать ES6 (и некоторые фичи из ES7) уже сегодня. Подробнее в [документации](/docs/ru/js-processing.md).
* [SCSS, SASS](http://sass-lang.com/), [LESS](http://www.lesscss.ru/) или [Stylus](http://learnboost.github.io/stylus/) в качестве препроцессора для css. Также в комплекте идет небольшой набор миксинов. Также можно использовать обычный css. Доступны sourcemaps. При выборе scss в качестве препроцессора, вы можете использовать как расширение scss, так и sass + можете миксовать их использование. Подробности [здесь](/docs/ru/css-processing.md).
* Никаких внешних библиотек и плагинов (кроме [html5shiv](https://ru.wikipedia.org/wiki/Html5_Shiv)). И да, это фича, так как вы вольны сами выбирать, какие библиотеки использовать. Доступны sourcemaps.
* Используется модуль [chokidar](https://github.com/paulmillr/chokidar) для вотчинга файлов.
* Расшариванием верстки с вашего компьютера во внешний веб, опционально. Ну и конечно же livereload в браузере (и не только локально) + графический интерфейс к панели управления устройствами, на которые расшаривается верстка.
* Можно легко добавлять новые таски и вотчеры. Есть примеры того, как создать и использовать новый таск или вотчер внутри TARS.
* Умная работа с изображениями. В первую очередь с вектором (svg). Больше не будет ада при верстке сайтов для экранов с высокой плотностью пикселей.
* Несколько режимов сборки (обычная, с минифицированными файлами, с хешем в названии css- и js-файлов для выкладки в продакшн).
* Создание архива с готовой сборкой.


## Установка

**Обращаю ваше внимание, что предпочтительно использовать [TARS-CLI](https://github.com/tars/tars-cli). Это удобнее, нагляднее, занимает меньше места.**

Необходимо [установить `Node.js`](http://nodejs.org/) версии >= 0.12 Если вы используете Node.js версии 5.x.x, убедитесь, что вы используете npm версии 3.3.10 и выше. В противном случае обновите npm:

```bash
npm i -g npm
```

Пользователям Windows необходимо выполнить еще пару шагов:

* перейти в C:\Program Files (x86)\nodejs или C:\Program Files\nodejs в cmd.exe или в любом другом терминале. Путь зависит от того, куда Node.js был установлен;
* запустите команду `npm install npm@latest`.

Возможно потребуются права суперюзера.

Далее необходимо установить gulp глобально. (Возможно потребуются права суперюзера или администратора)

```shell
npm install -g gulp
```

[Скачайте TARS](../../../tars/archive/master.zip) и распакуйте в рабочую директорию у себя на компьютере.
Затем устанавливаем зависимости. Команда запускается из папки с файлами TARS (обычно это tars-master).

```shell
npm install
```

Если не все зависимости были установлены, то последнюю операцию нужно повторить.

После установки всех зависимостей необходимо открыть tars-config (подробное описание опций [здесь](/docs/ru/options.md)) и настроить проект под себя.
В конфиге вы можете выбрать шаблонизатор, css-препроцессор, использование уведомлений, имена папок для различной статики и т.д.
После настройки проекта, выполняем следующую команду:

```shell
gulp init
```

Данная команда создаст базовую файловую структуру, подтянет таски для выбранных вами шаблонизатора и css-препроцессора.

Все готово, можно колбасить :)


## Основные команды

`gulp init` — Инициализирует проект с заданными опциями в tars-config. Создает файловую структуру.

`gulp re-init` — Переинициализирует проект с заданными опциями в tars-config. Предлагается использовать данную команду, если вы инициализировали проект с неверными опциями. При переинициализации все папки и файлы удаляются.

`gulp` или `gulp build` — делает сборку проекта. Подключаются не минимизированные файлы. Тип сборки зависит от переданных ключей вместе с этой командой. Доступные ключи:

* `--min` – в html подключаются минимизированные файлы.
* `--release` – в html подключаются минимизированные файлы, в названии которых есть hash. Данный режим полезен, если вы напрямую выкладываете верстку на сервер. 

`gulp dev` — инициализация сборщика в режиме разработки. Создается dev-версия проекта, без всех минификаций. Также запускает вотчеры за файлами проекта. Доступные ключи:

* `--lr` – инициализация livereload (живая презагрузка страницы при изменениях в файлах проекта), если он включен в конфиге проекта.
* `--tunnel` – инициализация проекта с расшариванием верстки во внешний веб.

Ссылка будет указана в консоли. Также будет указана ссылка на панель управления устройствами, на которые расшарена верстка.

`gulp build-dev` — генерация dev-версии проекта без вотчеров.

Ключи, доступные при любом режиме сборки:

* `--ie8` – включить в сборку стили для ie8.
* `--ie9` – включить в сборку стили для ie9.
* `--ie` – включить в сборку стили для ie9 и ie8.

`gulp update-deps` – обновление всех зависимостей сборщика до последних стабильных. Может потребоваться какое-то время на выполнение данной команды. Желательно выполнять раз в неделю. Команда скопирует текущий package.json, добавит к его имени подчеркивание, скачает новый package.json с репозитория и выполнит npm install. Таким образом, если у вас что-то сломалось с новыми пакетами, то всегда можно вернуться на прошлую версию, просто вернув прошлый package.json
Также вы можете ознакомиться с [руководством по обновлению](/docs/ru/update-guide.md).


## Документация

Важно! Все примеры в документации используют настройки по умолчанию.

* [Файловая структура](/docs/ru/file-structure.md)
* [Работа с тасками и вотчерами](/docs/ru/tasks-workflow.md)
* [Опции](/docs/ru/options.md)
* [Html](/docs/ru/html-processing.md)
* [Css](/docs/ru/css-processing.md)
* [Js](/docs/ru/js-processing.md)
* [Работа с изображениями](/docs/ru/images-processing.md)
* [Работа со шрифтами и misc-файлами](/docs/ru/fonts-and-misc.md)
* [Сценарии использования](/docs/ru/scenarios.md)
* [Руководство по обновлению](/docs/ru/update-guide.md)
* [Руководство для контрибуторов](/docs/ru/for-contributors.md)
* [FAQ](/docs/ru/faq.md)


## Последние изменения

Все последние изменения доступны по ссылке: [История изменений](/docs/ru/changelog.md).

По всем вопросам можно писать в [gitter](https://gitter.im/2gis/tars?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) или на почту [tars.builder@gmail.com](mailto:tars.builder@gmail.com)

Баги и фича-реквесты сюда: [issues](https://github.com/2gis/tars/issues/new).