Using grunt webfonts

Question

I'm newish to grunt and trying to get it to create webfonts.

I have a package.js file

    {
        "name" : "SampleGrunt",
        "version" : "0.1.0",
        "author" : "Jeff",
        "private" : true,

        "devDependencies" : {
            "grunt" :                       "~0.4.0",
            "grunt-contrib-cssmin":         "*",
            "grunt-contrib-sass":           "*",
            "grunt-contrib-uglify":         "*",
            "grunt-contrib-watch":          "*",
            "grunt-cssc":                   "*",
            "grunt-htmlhint":               "*",
            "grunt-webfont":                "*",
            "matchdep":                     "*"
        }
    }

and the following gruntfile.js

    module.exports = function(grunt){

       "use strict";
       require("matchdep").filterDev("grunt-*").forEach(grunt.loadNpmTasks);

        grunt.initConfig({

            pkg: grunt.file.readJSON('package.json'),

            watch: {
                js: {
                    files: ['js/base.js'],
                    tasks: ['uglify']
                }

                            font:{
                                files: ['icons/*.svg'],
                                tasks: ['webfonts']
                            }

            },

            uglify: {
                build: {
                    files: {
                        'js/base.min.js': 'js/base.js'
                    }
                }
            },

                    webfont:{
                        icons:{
                            src: 'icons/*.svg',
                            dest: 'fonts'
                        }
                    }

        });

        grunt.registerTask('default', 'watch');
    };

I run npm install in the terminal to download the includes.

I have a svg file in a icons folder that I would like to create into a font in the fonts folder.

Without the webfont the uglify works and I get the minified js file.

I was hoping to include web fonts in the same watch to.

Answer 1

There are 2 issues I see. First is you're missing a comma before 'font' inside watch. Secondly, your task name to run when an svg is changed is webfonts (with an 's') but your task is just webfont (singular).