diff --git a/package.json b/package.json
index f2defc2d7..237922532 100644
--- a/package.json
+++ b/package.json
@@ -21,16 +21,21 @@
   "devDependencies": {
     "babel": "^5.8.20",
     "babel-eslint": "^3.1.9",
+    "browserify-optional": "^1.0.0",
     "chai": "^3.2.0",
     "eslint": "^0.21.2",
     "eslint-plugin-react": "^2.3.0",
     "gulp": "^3.8.11",
+    "imports-loader": "^0.6.4",
     "istanbul": "^0.3.17",
     "jsdom": "^5.6.1",
     "mocha": "^2.2.5",
     "react-component-gulp-tasks": "^0.7.0",
     "sinon": "^1.16.1"
   },
+  "browserify": {
+    "transform": ["browserify-optional"]
+  },
   "browserify-shim": {
     "react": "global:React"
   },
diff --git a/src/menuFactory.js b/src/menuFactory.js
index 52a32b22c..b3253fa7b 100644
--- a/src/menuFactory.js
+++ b/src/menuFactory.js
@@ -1,10 +1,17 @@
 'use strict';
 
 import React from 'react';
-import snap from 'snapsvg';
 import BurgerIcon from './BurgerIcon';
 import CrossIcon from './CrossIcon';
 
+// Snap.svg workaround for Webpack using imports-loader (https://github.com/webpack/imports-loader).
+let snap;
+try {
+  snap = require('imports?this=>window,fix=>module.exports=0!snapsvg/dist/snap.svg.js');
+} catch(e) {
+  snap = require('snapsvg');
+}
+
 export default (styles) => {
 
   return React.createClass({