使用grunt模块创建svg精灵

问题描述:

我是grunt和node js的新手。我正在使用grunt-svg-sprite模块创建svg sprites时遇到问题。我已使用grunt-svg-sprite模块创建svg精灵图像。我已经使用以下命令安装了grunt-svg-sprite模块。使用grunt模块创建svg精灵

npm install grunt-svg-sprite --save-dev 

我使用下面一行启用了我的grunt.js文件中的插件。

grunt.loadNpmTasks('grunt-svg-sprite'); 

而且我的插件配置如下低于

Project_folder 
    ├───css 
    ├───Images 
    │ └───svg-logo 
    ├───GruntFile.js 
    ├───html 
    ├───node_modules 
    ├───include 
    ├───package.json 

当我运行下面的命令,我得到了成功的消息

svg_sprite     : { 
    basic     : { 

     // Target basics 
     expand    : true, 
     cwd     : 'images/svg-logo/', 
     src     : 'images/svg-logo/*.svg', 
     dest    : 'out/', 

     // Target options 
     options    : { 
      mode   : { 
       css   : {  // Activate the «css» mode 
        render : { 
         css : true // Activate CSS output (with default options) 
        } 
       } 
      } 
     } 
    } 
}, 

我的文件夹结构中给出,但是有没有创建文件夹。

这里一切都很好。 src应该只指定那里的文件。 试试这个。

svg_sprite : { 
     basic : { 

      expand : true, 
      cwd : 'images/svg-logo', 
      src : ['**/*.svg'], 
      dest : 'out', 

      options : { 
       mode : { 
        css : { 
         render : { 
          css : true 
         }, 
        }, 
       }, 
      }, 
     }, 
    }, 
+0

这就像一个魅力...感谢thiyagesh – 2015-04-02 06:23:12