Slide 1

Slide 1 text

Grunt v1 & gulp v4 11 Mar, 2015 / Gotanda.js #3 in free @pine613

Slide 2

Slide 2 text

目次 n Grunt ü v0.4.5 -> v1.0.0 変更点 ü v0.4.5 -> v1.0.0 移行ガイド n gulp ü v3.x -> v4.x 変更点 ü v3.x -> v4.x 移行ガイド n まとめ

Slide 3

Slide 3 text

Grunt

Slide 4

Slide 4 text

Grunt n Ben Alman 氏 開発のタスクランナー n 2014/05/13 - Grunt v0.4.5 released n 2015/11/19 - jQuery Foundation へ移管 ü 開発・メンテナンス停滞により n 2016/02/12 - Grunt v1.0.0-rc1 released

Slide 5

Slide 5 text

diff: Grunt v0.4.5 -> v1.0.0 詳細: https://github.com/gruntjs/grunt/compare/v0.4.5...v1.0.0-rc1 n 依存ライブラリの更新 ü coffee-script ~1.3.3 -> ~1.10.0 ü nopt ~1.0.10 -> ~3.0.6 ü glob ~3.2.21 -> ~6.0.4 ü lodash ~0.9.2 -> ~4.3.0 • grunt.util._ is deprecated ü iconv-lite ~0.2.11 -> ~0.4.13 ü js-yaml ~2.0.5 -> ~3.5.2

Slide 6

Slide 6 text

移行: Grunt v0.4.5 -> v1.0.0 詳細: https://github.com/gruntjs/grunt/compare/v0.4.5...v1.0.0-rc1 n 基本的に v0.4.5 からそのまま移行可能 n Grunt の内部ライブラリ依存は別途参照 grunt.util._ var _ = require(‘lodash’) grunt.file.readYAML var YAML = require('js-yaml’)

Slide 7

Slide 7 text

gulp

Slide 8

Slide 8 text

gulp n ストリームベースのビルドシステム n Grunt より普及しているといえる ü gulp: 88,646 downloads / day ü Grunt: 63,219 downloads / day n 2016/02/09 - gulp v3.9.1 released (最新安定版) n gulp v4.0.0 ... 現在開発中

Slide 9

Slide 9 text

詳細: https://github.com/gulpjs/gulp/compare/v3.9.1...4.0 diff: gulp v3.x -> v4.x n タスク実行システムの変更 ü 内部ライブラリ変更: orchestrator -> undertaker (bach) ü タスクの並列 / 直列実行が容易に n ファイルの扱いの変更 ü 内部ライブラリ変更: vinyl-fs (glob-watcher) -> chokidar ü 変更監視の高速化が期待

Slide 10

Slide 10 text

詳細: https://github.com/gulpjs/gulp/compare/v3.9.1...4.0 移行: gulp v3.x -> v4.x gulp.task(‘check’, gulp.parallel(‘lint’, ‘test’)); gulp.task(‘check’, [‘lint’, ‘test’]); gulp v3.x gulp v4.x この記法は廃止 parallel / series を用いて記述 並列 / 直列記述が容易に

Slide 11

Slide 11 text

詳細: https://github.com/gulpjs/gulp/compare/v3.9.1...4.0 移行: gulp v3.x -> v4.x gulp.task(‘hello’, function () { console.log(‘Hello world’); }); gulp v3.x gulp v4.x gulp.task(‘hello’, function (done) { console.log(‘Hello world’); done(); }); この記法は廃止 明示的な終了が必要 ※ ストリーム / Promise の返却でも可

Slide 12

Slide 12 text

まとめ

Slide 13

Slide 13 text

Thanks ALLPPT.com _ Free PowerPoint Templates, Diagrams and Charts