Intro to Grunt.js (Norwegian)

Introduction to Grunt.js build manager.

Transcript

1. Hans Kristian Flaatten – @starefossen
3. HVA ER GRUNT? • Enkel automatisering av oppgaver • Sammenslåing og komprimering • Testing og linting • Kompilering osv. • Skrevet i v8 JavaScript (aka. Node.JS) 
4. HVORFOR GRUNT? • Stabilt og veletablert • Enkelt å sette opp – enkelt å kjøre • Rikt økosystem med «støtte for det meste»
6. INSTALLER $ npm install grunt grunt-cli $ npm install grunt-contrib-jshint $ npm install grunt-contrib-foo
7. KONFIGURER module.exports = function(grunt) { ! // Project configuration. grunt.initConfig({ jshit: { options: { curly: true, eqeqeq: true, eqnull: true, }, files: [ 'Gruntfile.js', 'src/**/*.js', ] } }); ! // Load the plugin that provides the "jshint" task. grunt.loadNpmTasks('grunt-contrib-jshint'); ! // Default task(s). grunt.registerTask('default', ['jshint']); ! };
8. PROFIT $ grunt jshint > Running "jshint:files" (jshint) task app.js 6 | process(card) ^ Missing semicolon.
9. LESS less: { compile: { options: { modifyVars: { imgPath: '"https://aws-s3..."' } }, ! files: { "less/app.less": "css/app.css" } } }
10. FILE WATCHER watch: { js: { files: ['js/**/*.js'], tasks: ['compile:js'] }, less: { files: ['less/**/*.less'], tasks: ['compile:less'] } }
11. DEMO
12. OG MANGE FLER... • grunt-contrib-imagemin • grunt-contrib-cssmin • grunt-contrib-csslint • grunt-contrib-concat • grunt-s3 • grunt-pylint • grunt-ssh-deploy • gruntjs.com/plugins
13. ALTERNATIVER Gulp Yeoman Broccoli.js
15. Never gonna give you up Never gonna let you down Never gonna run around and desert you Never gonna make you cry Never gonna say goodbye Never gonna tell a lie and hurt you