Task Automatisierung mit Grunt.js

Task Automatisierung mit
Grunt.js
Erfan Ebrahimnia | MASSIVE ART | VlbgWebDev

SASS / LESS kompilieren

Bilder optimieren

Assets versionieren

Tests ausführen

JavaScript Linting

das wars …
Ne Spaß, es kann noch viel
mehr

CSS minifizieren

File Header Kommentar
hinzufügen

Apache Ant:
<?xml version="1.0" encoding="utf-8"?>
<project name="demo" default="prod">

<target name="-js.concatenate">
<concat destfile="/Users/3rfan/demo/dist/js/main.build.js"
>
<fileset dir="/Users/3rfan/demo/js/" includes="main.js"/>
</concat>
<echo>Finished</echo>
</target>
</project>

Grunt:
module.exports = function (grunt) {
grunt.loadNpmTasks(
'grunt-contrib-uglify'
);
grunt.initConfig({
uglify: {
dist: {
files: {
'dist/main.min.js' ['js/main.js']
:
}
}
}
});
grunt.registerTask(
'build', ['uglify']);
}

Grunt installieren:

npm install -g grunt-cli

Benötigte Files:
Gruntfile.js
package.json

package.json
{
"name": "my-awesome-app",
"version": "0.0.0",
"devDependencies": {
"grunt": "~0.4.x"
}
}

Gruntfile:
grunt.loadNpmTasks(
);
grunt.initConfig({
uglify: {
dist: {
files: {
:
}
}
}
});
grunt.registerTask(
}

Gruntfile:
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.initConfig({
uglify: {
dist: {
files: {
'dist/main.min.js': ['js/main.js']
}
}
}
});
grunt.registerTask('build', ['uglify']);
}

Gruntfile:
grunt.loadNpmTasks(
);
grunt.initConfig({
uglify: {
dist: {
files: {
}
}
}
});
}

package.json
{
"name": "my-awesome-app",
"version": "0.0.0",
"devDependencies": {
"grunt": "~0.4.x",
"grunt-contrib-uglify": "0.2.7"
}
}

Gruntfile:
grunt.initConfig({
uglify: {
dist: {
files: {
:
}
}
}
});
}

Gruntfile:
grunt.initConfig({
uglify: {
dist: {
files: {
}
}
}
});
grunt.registerTask(
}

Task Automatisierung mit Grunt.js

More Related Content

What's hot (16)

Task Automatisierung mit Grunt.js