diff --git a/index.js b/index.js
index 4adcd219..942e248f 100644
--- a/index.js
+++ b/index.js
@@ -15,7 +15,6 @@ module.exports.pitch = function (remainingRequest) {
   var isProduction = this.minimize || process.env.NODE_ENV === 'production'
   var addStylesClientPath = loaderUtils.stringifyRequest(this, '!' + path.join(__dirname, 'lib/addStylesClient.js'))
   var addStylesServerPath = loaderUtils.stringifyRequest(this, '!' + path.join(__dirname, 'lib/addStylesServer.js'))
-  var addStylesShadowPath = loaderUtils.stringifyRequest(this, '!' + path.join(__dirname, 'lib/addStylesShadow.js'))
 
   var request = loaderUtils.stringifyRequest(this, '!!' + remainingRequest)
   var relPath = path.relative(__dirname, this.resourcePath).replace(/\\/g, '/')
@@ -41,41 +40,41 @@ module.exports.pitch = function (remainingRequest) {
     'if(content.locals) module.exports = content.locals;'
   ]
 
-  // shadowMode is enabled in vue-cli with vue build --target web-component.
-  // exposes the same __inject__ method like SSR
-  if (options.shadowMode) {
-    return shared.concat([
-      '// add CSS to Shadow Root',
-      'var add = require(' + addStylesShadowPath + ').default',
-      'module.exports.__inject__ = function (shadowRoot) {',
-      '  add(' + id + ', content, shadowRoot)',
-      '};'
-    ]).join('\n')
-  } else if (!isServer) {
-    // on the client: dynamic inject + hot-reload
-    var code = [
-      '// add the styles to the DOM',
-      'var add = require(' + addStylesClientPath + ').default',
-      'var update = add(' + id + ', content, ' + isProduction + ', ' + JSON.stringify(options) + ');'
-    ]
-    if (!isProduction) {
-      code = code.concat([
-        '// Hot Module Replacement',
-        'if(module.hot) {',
-        ' // When the styles change, update the <style> tags',
-        ' if(!content.locals) {',
-        '   module.hot.accept(' + request + ', function() {',
-        '     var newContent = require(' + request + ');',
-        "     if(typeof newContent === 'string') newContent = [[module.id, newContent, '']];",
-        '     update(newContent);',
-        '   });',
-        ' }',
-        ' // When the module is disposed, remove the <style> tags',
-        ' module.hot.dispose(function() { update(); });',
-        '}'
-      ])
+  if (!isServer) {
+    var code = function(id, isProduction, options) {
+      // style-loader: Adds some css to the DOM by adding a <style> tag
+      var content = require(REQUEST)
+      var addStylesClient = require(ADD_STYLES_CLIENT_PATH).default
+      var install = function(target) {
+        update = addStylesClient(id, content, isProduction, options, target)
+      }
+      var update = null
+      if (typeof content === 'string') content = [[module.id, content, '']]
+      if (content.locals) {
+        module.exports = content.locals
+        return
+      } else if (module.hot) {
+        module.hot.accept(REQUEST, function() {
+          var newContent = require(REQUEST)
+          if (typeof newContent === 'string') newContent = [[module.id, newContent, '']]
+          update(newContent)
+        })
+        module.hot.dispose(function() {
+          update();
+        })
+      }
+      if (options.shadowMode) {
+        module.exports.__inject__ = function(shadowRoot) {
+          install(shadowRoot)
+        }
+      } else {
+        install(typeof document !== 'undefined' && document.head)
+      }
     }
-    return shared.concat(code).join('\n')
+    return `(${code})(${id},${isProduction},${JSON.stringify(options)})`
+      .split('REQUEST').join(request)
+      .split('ADD_STYLES_CLIENT_PATH').join(addStylesClientPath)
+
   } else {
     // on the server: attach to Vue SSR context
     if (isVue) {
diff --git a/lib/addStylesClient.js b/lib/addStylesClient.js
index 920b00bb..fb93e225 100644
--- a/lib/addStylesClient.js
+++ b/lib/addStylesClient.js
@@ -49,9 +49,11 @@ var ssrIdKey = 'data-vue-ssr-id'
 // tags it will allow on a page
 var isOldIE = typeof navigator !== 'undefined' && /msie [6-9]\b/.test(navigator.userAgent.toLowerCase())
 
-export default function addStylesClient (parentId, list, _isProduction, _options) {
+export default function addStylesClient (parentId, list, _isProduction, _options, _styleParent) {
   isProduction = _isProduction
 
+  if (_styleParent) head = _styleParent
+
   options = _options || {}
 
   var styles = listToStyles(parentId, list)
diff --git a/lib/addStylesShadow.js b/lib/addStylesShadow.js
deleted file mode 100644
index 72947108..00000000
--- a/lib/addStylesShadow.js
+++ /dev/null
@@ -1,70 +0,0 @@
-import listToStyles from './listToStyles'
-
-export default function addStylesToShadowDOM (parentId, list, shadowRoot) {
-  var styles = listToStyles(parentId, list)
-  addStyles(styles, shadowRoot)
-}
-
-/*
-type StyleObject = {
-  id: number;
-  parts: Array<StyleObjectPart>
-}
-
-type StyleObjectPart = {
-  css: string;
-  media: string;
-  sourceMap: ?string
-}
-*/
-
-function addStyles (styles /* Array<StyleObject> */, shadowRoot) {
-  const injectedStyles =
-    shadowRoot._injectedStyles ||
-    (shadowRoot._injectedStyles = {})
-  for (var i = 0; i < styles.length; i++) {
-    var item = styles[i]
-    var style = injectedStyles[item.id]
-    if (!style) {
-      for (var j = 0; j < item.parts.length; j++) {
-        addStyle(item.parts[j], shadowRoot)
-      }
-      injectedStyles[item.id] = true
-    }
-  }
-}
-
-function createStyleElement (shadowRoot) {
-  var styleElement = document.createElement('style')
-  styleElement.type = 'text/css'
-  shadowRoot.appendChild(styleElement)
-  return styleElement
-}
-
-function addStyle (obj /* StyleObjectPart */, shadowRoot) {
-  var styleElement = createStyleElement(shadowRoot)
-  var css = obj.css
-  var media = obj.media
-  var sourceMap = obj.sourceMap
-
-  if (media) {
-    styleElement.setAttribute('media', media)
-  }
-
-  if (sourceMap) {
-    // https://developer.chrome.com/devtools/docs/javascript-debugging
-    // this makes source maps inside style tags work properly in Chrome
-    css += '\n/*# sourceURL=' + sourceMap.sources[0] + ' */'
-    // http://stackoverflow.com/a/26603875
-    css += '\n/*# sourceMappingURL=data:application/json;base64,' + btoa(unescape(encodeURIComponent(JSON.stringify(sourceMap)))) + ' */'
-  }
-
-  if (styleElement.styleSheet) {
-    styleElement.styleSheet.cssText = css
-  } else {
-    while (styleElement.firstChild) {
-      styleElement.removeChild(styleElement.firstChild)
-    }
-    styleElement.appendChild(document.createTextNode(css))
-  }
-}
diff --git a/package.json b/package.json
index 30b7be5a..7f981b11 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "vue-style-loader",
-  "version": "4.1.2",
+  "name": "@alancnet/vue-style-loader",
+  "version": "4.1.4",
   "author": "Evan You",
   "description": "Vue.js style loader module for webpack",
   "repository": {
@@ -22,5 +22,8 @@
     "babel-plugin-transform-es2015-modules-commonjs": "^6.26.0",
     "conventional-changelog-cli": "^2.0.1",
     "jest": "^22.1.4"
+  },
+  "jest": {
+    "testURL": "http://localhost/"
   }
 }