利用grunt-svgstore 插件生成 svg-sprite

package.json

"devDependencies": {
    "grunt": "^1.0.4",
    "grunt-contrib-clean": "^2.0.0",
    "grunt-contrib-jshint": "^2.1.0",
    "grunt-contrib-nodeunit": "^2.0.0",
    "grunt-contrib-uglify": "^4.0.1",
    "grunt-svgstore": "^2.0.0"
  }

安装指令

npm install -g grunt-cli
npm install grunt –save-dev
npm install grunt-contrib-clean –save-dev
npm install grunt-contrib-nodeunit –save-dev
npm install grunt-contrib-uglify–save-dev
npm install grunt-svgstore –save-dev

创建Gruntfile.js --项目根目录下

module.exports = function(grunt) {
    // 配置
    grunt.initConfig({
        svgstore: {
            options: {
              prefix : 'icon-', 
              svg: { 
                viewBox : '0 0 200 200',
                xmlns: 'http://www.w3.org/2000/svg'
              },
              includedemo:true,
            },
            default : {
              files: {
                'tmp/demo-svg.svg': ['tests/iconfont/*.svg'], //生成位置  和 源svg位置
              },
            }
        }
    });
    // 载入grunt-svgstore
    grunt.loadNpmTasks('grunt-svgstore');
    // 注册任务
    grunt.registerTask('default', ['svgstore']);
};

执行命令

cd  项目目录
grunt

demo-svg.svg
demo-svg-demo.html