Grunt — Advanced Tips

GRUNT — ADVANCED TIPS Nikita Bayev Front-end developer @ Chocomart.kz
! !1

gruntjs.com

nodejs.org

> grunt

!6 Оптимизация Автоматизация Минификация Генерация

!7 Autoprefixer imgo Borschik banner concurrent

!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'); Оптимизация изображений

!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

Grunt — Advanced Tips

Grunt — Advanced Tips

Nikita Bayev

More Decks by Nikita Bayev

Other Decks in Technology

Featured

Transcript