使用grunt模塊創建svg精靈

Question

我是grunt和node js的新手。我正在使用grunt-svg-sprite模塊創建svg sprites時遇到問題。我已使用grunt-svg-sprite模塊創建svg精靈圖像。我已經使用以下命令安裝了grunt-svg-sprite模塊。

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) 
        } 
       } 
      } 
     } 
    } 
}, 

我的文件夾結構中給出，但是有沒有創建文件夾。

Answer 1

這裏一切都很好。 src應該只指定那裏的文件。 試試這個。

svg_sprite : { 
     basic : { 

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

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