GRUNT — ADVANCED TIPS
Nikita Bayev Front-end developer @ Chocomart.kz !
!1
gruntjs.com
nodejs.org
> grunt
!5
!6
Оптимизация
Автоматизация
Минификация
Генерация
!7
Autoprefixer
imgo
Borschik
banner
concurrent
!8
!9
Autoprefixer grunt.loadNpmTasks(‘grunt-autoprefixer');Чистка кода
Добавление нужны вендорных префиксов
Удаление устаревших ненужных вендорных префиксов
Используется база данных caniuse.com
Умеет работать с препроцессорами и source maps
!10
Конфигурация grunt-autoprefixer
!11
И это все?
!12
Добавим немного опций
!13
Добавим немного опций
!14
borschik grunt.loadNpmTasks('grunt-borschik');
Сборка статичных файлов
“Умная” минификация CSS и JS
!15
Конфигурация borschik
!16
imgo grunt.loadNpmTasks('grunt-imgo');
Оптимизация изображений
!17
!18
Создаем задачу imgo
!19
grunt.loadNpmTasks('grunt-concurrent');
Асинхронный запуск тасков
!20
Конфигурация grunt-concurrent
!21
Что еще?
grunt-remove-logging — удаление console.log()
grunt-dploy — помощь в деплое на дев/продакшн сервера
grunt-contrib-imagemin — оптимизация изображений
grunt-dev-update — обновление npm-зависимостей
И еще много всего на github.com и gruntjs.com
!22
Спасибо за внимание
twitter.com/Nikita_Bayev | github.com/drugoi