About

Стартовая сборка gulp

Установка

Откройте консоль и клонируйте этот репозиторий.
git clone https://github.com/brendan8c/start_gulp.git
В вашем редакотре кода откройте этот проект и запустите команду.
npm i

Для обновления зависимостей я использую:

npm-check-updates

'npm-check-updates' обновляет зависимости вашего 'package.json' до последних версии.

https://github.com/raineorshine/npm-check-updates
Установите: npm i -g npm-check-updates

1. ncu –Показать любые новые зависимости для проекта в текущем каталоге.
2. ncu -u –Обновить package.json
3. ncu -g –Проверьте глобальные пакеты.

Как пользоваться:

Проект разрабатывается в папке app
Готовая сборка будет находится в папке build
В папке build будет так-же присутсвовать папка sourcemaps.
Папка содержит в себе карты кода для более удобной отладки во время разработки.
Загружать эту папку на сервер не нужно!

Для запуска разработки и одновременной сборки введите: gulp
Для запуска разработки введите: gulp streams
Для запуска сборки введите: gulp builds
В обоих случаях проект будет собран одинаково.
Режим разработки происходит в реал тайме, перезагружать gulp нет необходимости, все изменения вносятся и добавляются мгновенно.

Шрифт будет автоматически сконвертирован из формата ttf в woff и woff2.
В стилях '_fonts.scss' нужно сразу указывать эти (woff и woff2) разрешения форматов!
Большинство современных браузеров поддерживают эти форматы.

https://caniuse.com/?search=.woff
https://caniuse.com/?search=.woff2

Gulp при сборке автоматически сконвертирует единицы измерения px в rem! Для таких свойств как 'font', 'font-size', 'line-height', 'letter-spacing'. Это сработает как в файлах стилей css так и для html документа.

Дополнительно:

Также я оставил много комментариев в файле 'gulpfile.js' я думаю это поможет быстрее понять его структуру.

"dependencies": Пакеты, необходимые для работы вашего приложения.
"devDependencies": Пакеты, необходимые только для локальной разработки и тестирования.

Чтобы добавить зависимости в "devDependencies" выполните следующую команду:
npm install <имя-пакета> --save-dev Краткий пример: npm i -D normalize.css
Чтобы добавить зависимости в "dependencies" выполните следующую команду:
npm install <имя-пакета> --save-prod Краткий пример: npm i -P normalize.css

При запуске npm i, npm загрузит зависимости из devDependencies, перечисленные в, package.json