Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

  1. Install grunt-webfont from https://github.com/sapegin/grunt-webfont. Install the node engine version without fontforge.
  2. Create a Gruntfile.js such as the following below:

    Code Block
    languagejs
    titleGruntfile.js
    linenumberstrue
    module.exports = function(grunt) {
     // Project configuration.
     grunt.initConfig({
     pkg: grunt.file.readJSON('package.json'),
    
            webfont: {
                icons: {
                    src: 'icons/*.svg',
                    dest: 'src/fonts/',
                    destCss: 'src/css/',
                    options: {
                    	engine: 'node',
                        fontHeight: 52, // Avoid encountering metric-related issues.
                        normalize: false,
                        ascent: 64, // Top height measured from the bottom of the glyph boundary.
                        descent: 0, // Bottom height measured from the bottom of the glyph boundary.
                        font: 'icons', // Name of the font.
                        destHtml: 'assets/',
                        templateOptions: {
                            classPrefix: 'icon-'
                        }
                    }
                }
            }
    });
    
    // Load the plugin that provides the “uglify” task.
    grunt.loadNpmTasks('grunt-webfont');
    
    // Default task(s).
    grunt.registerTask('default', ['webfont']);
    
    };