Add support for custom tag attribute

webpack-contrib · Dec 10, 2016 · 3ac9caf · 3ac9caf
1 parent 78de576
commit 3ac9caf
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 2 deletions.
diff --git a/README.md b/README.md
@@ -61,6 +61,10 @@ By default, the style-loader appends `<style>` elements to the end of the `<head
 
 If defined, the style-loader will re-use a single `<style>` element, instead of adding/removing individual elements for each required module. **Note:** this option is on by default in IE9, which has strict limitations on the number of style tags allowed on a page. You can enable or disable it with the singleton query parameter (`?singleton` or `?-singleton`).
 
+#### `tagAttrs`
+
+If defined, style-loader will attach given attributes with there values on `<style>` / `<link>` element.
+
 ## Recommended configuration
 
 By convention the reference-counted API should be bound to `.useable.css` and the simple API to `.css` (similar to other file types, i.e. `.useable.less` and `.less`).

diff --git a/addStyles.js b/addStyles.js
@@ -26,6 +26,8 @@ module.exports = function(list, options) {
 	}
 
 	options = options || {};
+  options.tagAttrs = typeof options.tagAttrs === "object"? options.tagAttrs : {};
+
 	// Force single-tag solution on IE6-9, which has a hard limit on the # of <style>
 	// tags it will allow on a page
 	if (typeof options.singleton === "undefined") options.singleton = isOldIE();
@@ -128,18 +130,29 @@ function removeStyleElement(styleElement) {
 
 function createStyleElement(options) {
 	var styleElement = document.createElement("style");
-	styleElement.type = "text/css";
+  options.tagAttrs.type = "text/css";
+
+  attachTagAttrs(styleElement, options.tagAttrs);
 	insertStyleElement(options, styleElement);
 	return styleElement;
 }
 
 function createLinkElement(options) {
 	var linkElement = document.createElement("link");
-	linkElement.rel = "stylesheet";
+  options.tagAttrs.rel = "stylesheet";
+  attachTagAttrs(styleElement, options.tagAttrs);
 	insertStyleElement(options, linkElement);
 	return linkElement;
 }
 
+function attachTagAttrs(element, attrs) {
+	for(var key in attrs) {
+		if(attrs.hasOwnProperty(key)) {
+			element.setAttribute(key, attrs[key]);
+		}
+	}
+}
+
 function addStyle(obj, options) {
 	var styleElement, update, remove;