snapsvg and requirejs, Cannot read property 'on' of undefined`

Question

I'm using require and webpack on a project and want to use snapsvg but when I include it I get the error:

Uncaught TypeError: Cannot read property 'on' of undefined

Code is:

var Snap = require('snapsvg');
SVG = Snap('#svg');

Answer 1

You can also use snapsvg-cjs, which is actually wrapper writter in snapsvg with common js.

Steps:

npm install snapsvg-cjs

Import in component like below:-

import "snapsvg-cjs";

declare const Snap: any;

Now you have Snap object.

Answer 2

Ah the way to do it is to add:

var webpack = require('webpack');
module.exports = {
  ...
  module: {
    loaders: [{
      test: require.resolve('snapsvg'),
      loader: 'imports-loader?this=>window,fix=>module.exports=0'
    }]
  }
  ...
};

in webpack.config.js using imports-loader