Svg-sprite-loader: TypeError: must be an object

[edaena]

I have the following in the webpack.config.js:

module.exports = {
  entry: ["./utils", "./app.js"],
  output: {
    filename: "bundle.js"
  },
  module: {
  loaders: [
    {
      test: /\.svg$/,
      loader: 'svg-sprite'
    }
    ]
  },
  watch: true
}

In the same directory of my app.js file I have the legoMan.svg file. In the app.js file I have:

var id = require('svg-sprite!./legoMan.svg');
console.log('App loaded');

When I run webpack I get the following:

ERROR in ./~/svg-sprite-loader!./legoMan.svg
Module build failed: TypeError: Must be an object
    at exports.objectToAttrString (/webpack-test/node_modules/svg-sprite-loader/lib/utils.js:6:11)
    at SVGDocument.toString (/webpack-test/node_modules/svg-sprite-loader/lib/svg-document.js:29:18)
    at Object.module.exports (/webpack-test/node_modules/svg-sprite-loader/index.js:47:17)
 @ ./app.js 2:9-44

I have searched for this error, and found that for someone it was because they had another loader conflicting with svgs, however in my case the only loader that I have specified is svg-sprite. Does anyone have some insight as to why I might be getting this error?

[edaena]

I checked further and the issue appears to be in svg-document.js in these lines:

var attrs = $svg.attr();
var attrsStr = objToAttrString(attrs);

The object type appears to be 'undefined' and it throws the 'Must be an object' error. However, I printed the value of attars and it's not undefined but when it reaches the function in utils.js, it receives it as undefined.

[princed]

Could you, please, provide your svg file, if possible?

[edaena]

This is the file, I changed it to '.txt' because '.svg' wasn't supported to upload.

legoMan.txt

[princed]

@edaena Thanks, it helps!

@kisenka Loader seems to be used for the second time somehow, here is request from second run: /Users/princed/Projects/svg-testcase/node_modules/svg-sprite-loader/index.js!/Users/princed/Projects/svg-testcase/node_modules/svg-sprite-loader/index.js!/Users/princed/Projects/svg-testcase/legoMan.svg

[princed]

Gist with complete test-case — https://gist.github.com/princed/8f2ae86a3839019e50f966656cb87e2d

[kisenka]

Hi guys! Sorry for the delay.
You trying to process SVG files twice: first in Webpack config, and then in require statement.
If you just require file require('./legoMan.svg'); - all works.

[princed]

:see_no_evil: