Software

Zeit sparen mit Grunt

Dieser Artikel ist älter als zwei Jahre und womöglich veraltet!

Mit dem Tool Grunt ist es möglich wiederkehrende Aufgaben beim Entwickeln von JavaScript-Bibliotheken zu automatisieren.

Grunt-Logo

Beim Entwickeln meiner Strichcode-Bibliothek bin ich auf Grunt gestoßen und will es jetzt nicht mehr missen.

Installation

Unter der Voraussetzung von Node.js kann man Grunt einfach mit dem folgenden Befehl installieren:

npm install -g grunt-cli

Konfigurationsdatei

Zur Konfiguration wird eine Datei namens Gruntfile.js angelegt, in der die Aufgaben definiert werden. Hier ist ein Beispiel einer Konfigurationsdatei, wie ich sie aktuell in meiner Strichcode-Bibliothek verwende:

module.exports = function(grunt) {

    // Project configuration
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        uglify: {
            options: {
                banner: '/*\n* Copyright (c) <%= grunt.template.today("yyyy") %> Johannes Mittendorfer (http://johannes-mittendorfer.com)\n* Licensed under the MIT License (LICENSE.txt).\n*\n* Version <%= pkg.version %> <%= grunt.template.today("yyyy-mm-dd") %> \n*/\n\n'
            },
            build: {
                src: 'src/<%= pkg.name %>.js',
                dest: 'dist/<%= pkg.name %>.min.js'
            }
        },
        coffeelint: {
            app: ['src/<%= pkg.name %>.coffee'],
            options: {
                'max_line_length': {
                    'level': 'ignore'
                },
                'arrow_spacing': {
                    'level': 'warning'
                },
                'line_endings': {
                    'level': 'warning'
                },
                'no_empty_param_list': {
                    'level': 'warning'
                }
            }
        },
        jshint: {
            options: {
                curly: true,
                eqeqeq: true,
                eqnull: true,
                browser: true,
                globals: {
                    jQuery: true
                },
            },
            uses_defaults: ['src/**/*.js'],
        },
        qunit: {
            all: ['tests/**/*.html']
        },
        jquerymanifest: {
            options: {
                source: grunt.file.readJSON('package.json'),
                overrides: {
                    name: "ean13",
                    title: "jQuery EAN 13",
                    author: {
                        name: "Johannes Mittendorfer",
                        url: "http://johannes-mittendorfer.com"
                    },
                    homepage: "https://github.com/joushx/jQuery.EAN13",
                    demo: "http://demo.johannes-mittendorfer.com/jquery-ean13",
                    docs: "https://github.com/joushx/jQuery.EAN13/blob/master/README.md"
                }
            }
        },
        coffee: {
            compile: {
                files: {
                    'dist/<%= pkg.name %>.js': 'src/<%= pkg.name %>.coffee'
                }
            }
        }
    });

    // Load the plugin that provides the "uglify" task.
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-jshint');
    grunt.loadNpmTasks('grunt-contrib-qunit');
    grunt.loadNpmTasks('grunt-jquerymanifest');
    grunt.loadNpmTasks('grunt-contrib-coffee');
    grunt.loadNpmTasks('grunt-coffeelint');

    // Default task(s).
    grunt.registerTask('default', ['coffeelint', 'coffee', 'jshint', 'qunit', 'uglify', 'jquerymanifest']);

};

Dadurch wird die Coffeescript-Datei mit coffeelint überprüft, in Javascript umgewandelt, diese Datei geprüft, verkleinert und mit den Copyright-Headern ausgestattet. Außerdem werden die definierten Unit-Tests ausgeführt und eine Konfigurationsdatei für das jQuery-Plugin-Verzeichnis erstellt.

Ausführen

Ausführen lassen sich die Aufgaben anschließend einfach mit

grunt