Merge pull request #31 from sheerun/master

Add support for es6 interpolation

Author: sokra

README.md

@@ -74,6 +74,19 @@ require("html?root=.!./fileB.html");
 
 ```
 
+## Interpolation
+
+You can use `interpolate` flag to enable interpolation syntax for ES6 template strings, like so:
+
+```
+require("html?interpolate!./file.html");
+```
+
+```
+<img src="${require(`./images/gallery.png`)}" />
+<div>${require('./partials/gallery.html')}</div>
+```
+
 ## License
 
 MIT (http://www.opensource.org/licenses/mit-license.php)

index.js

@@ -8,6 +8,7 @@ var SourceNode = require("source-map").SourceNode;
 var loaderUtils = require("loader-utils");
 var url = require("url");
 var assign = require("object-assign");
+var compile = require("es6-templates").compile;
 
 function randomIdent() {
 	return "xxxHTMLLINKxxx" + Math.random() + Math.random() + "xxx";
@@ -37,15 +38,14 @@ module.exports = function(content) {
 	content = [content];
 	links.forEach(function(link) {
 		if(!loaderUtils.isUrlRequest(link.value, root)) return;
-        
+
 		var uri = url.parse(link.value);
 		if (uri.hash !== null && uri.hash !== undefined) {
-		    uri.hash = null;
-		    link.value = uri.format();
-		    link.length = link.value.length;
+			uri.hash = null;
+			link.value = uri.format();
+			link.length = link.value.length;
 		}
 
-        
 		do {
 			var ident = randomIdent();
 		} while(data[ident]);
@@ -77,7 +77,14 @@ module.exports = function(content) {
 
 		content = htmlMinifier.minify(content, minimizeOptions);
 	}
-	return "module.exports = " + JSON.stringify(content).replace(/xxxHTMLLINKxxx[0-9\.]+xxx/g, function(match) {
+
+	if (query.interpolate) {
+		content = compile('`' + content + '`').code;
+	} else {
+		content = JSON.stringify(content);
+	}
+
+	return "module.exports = " + content.replace(/xxxHTMLLINKxxx[0-9\.]+xxx/g, function(match) {
 		if(!data[match]) return match;
 		return '" + require(' + JSON.stringify(loaderUtils.urlToRequest(data[match], root)) + ') + "';
 	}) + ";";

package.json

@@ -4,6 +4,7 @@
   "author": "Tobias Koppers @sokra",
   "description": "html loader module for webpack",
   "dependencies": {
+    "es6-templates": "^0.2.2",
     "fastparse": "^1.0.0",
     "html-minifier": "^0.7.2",
     "loader-utils": "~0.2.2",

test/loaderTest.js

@@ -74,4 +74,16 @@ describe("loader", function() {
 	        'module.exports = "<img src=\\"" + require("./icons.svg") + "#hash\\">";'
 	    );
 	});
+	it("should ignore interpolations by default", function() {
+			loader.call({}, '<img src="${"Hello " + (1+1)}">').should.be.eql(
+				'module.exports = "<img src=\\"${\\"Hello \\" + (1+1)}\\">";'
+			);
+	});
+	it("should enable interpolations when using interpolate flag", function() {
+			loader.call({
+				query: "?interpolate"
+			}, '<img src="${"Hello " + (1+1)}">').should.be.eql(
+				'module.exports = "<img src=\\"" + ("Hello " + (1 + 1)) + "\\">";'
+			);
+	});
 });