feat: add option: ignoreFiles

It is useful for handling Angular templates correctly. see angular/angular-cli#3415

Author: Zhicheng Wang

README.md

@@ -173,6 +173,29 @@ require("html-loader?root=.!./file.html");
 // => '<img  src="http://cdn.example.com/49eba9f/a992ca.jpg">'
 ```
 
+### Ignore specified image files
+
+You can use `ignoreFiles` option to ignore some image files, like so:
+
+```js
+module: {
+  rules: [{
+    test: /\.html$/,
+    use: [ {
+      loader: 'html-loader',
+      options: {
+        ignoreFiles: [
+            /{{.*?}}/
+        ]
+      }
+    }],
+  }]
+}
+```
+
+`<img src="angular{{version}}.jpg"/>` should be remained as `<img src="angular{{version}}.jpg"/>`.
+You can also use a function or a string instead of the RegExp.
+
 ### Interpolation
 
 You can use `interpolate` flag to enable interpolation syntax for ES6 template strings, like so:

index.js

@@ -53,7 +53,7 @@ module.exports = function(content) {
 	content = [content];
 	links.forEach(function(link) {
 		if(!loaderUtils.isUrlRequest(link.value, root)) return;
-		
+
 		if (link.value.indexOf('mailto:') > -1 ) return;
 
 		var uri = url.parse(link.value);
@@ -142,9 +142,32 @@ module.exports = function(content) {
         exportsString = "export default ";
 	}
 
- 	return exportsString + content.replace(/xxxHTMLLINKxxx[0-9\.]+xxx/g, function(match) {
-		if(!data[match]) return match;
-		return '" + require(' + JSON.stringify(loaderUtils.urlToRequest(data[match], root)) + ') + "';
+	function shouldIgnoreFile(fileName) {
+		var rules = config.ignoreFiles || [];
+		return rules.find(function(rule) {
+			if (rule instanceof Function) {
+				return rule(fileName);
+			}
+
+			if (typeof rule === 'string') {
+				rule = new RegExp(rule);
+			}
+
+			if (rule instanceof RegExp) {
+				return rule.test(fileName);
+			}
+
+			throw "html-loader: the `ignoreRules` option should be an array of strings/RegExps/functions";
+		});
+	}
+
+	return exportsString + content.replace(/xxxHTMLLINKxxx[0-9\.]+xxx/g, function (match) {
+		var fileName = data[match];
+		if (!fileName) return match;
+		if (shouldIgnoreFile(fileName)) {
+			return fileName;
+		}
+		return '" + require(' + JSON.stringify(loaderUtils.urlToRequest(fileName, root)) + ') + "';
 	}) + ";";
 
 }

test/loaderTest.js

@@ -174,6 +174,53 @@ describe("loader", function() {
 			'module.exports = "<a href=\\"${list.href}\\"><img src=\\"" + require("./test.jpg") + "\\" /></a>";'
 		);
 	});
+	it("should ignore files specified by regexp", function() {
+		loader.call({
+			options: {
+				htmlLoader: {
+					ignoreFiles: [/{{.*?}}/]
+				}
+			}
+		}, '<img src="angular{{version}}.jpg"/>').should.be.eql('module.exports = "<img src=\\"angular{{version}}.jpg\\"/>";');
+	});
+
+	it("should ignore files specified by regexp(string)", function() {
+		loader.call({
+			options: {
+				htmlLoader: {
+					ignoreFiles: ["{{.*?}}"]
+				}
+			}
+		}, '<img src="angular{{version}}.jpg"/>').should.be.eql('module.exports = "<img src=\\"angular{{version}}.jpg\\"/>";');
+	});
+
+	it("should ignore files specified by function", function() {
+		loader.call({
+			options: {
+				htmlLoader: {
+					ignoreFiles: [function(fileName) {
+						return /{{.*?}}/.test(fileName);
+					}]
+				}
+			}
+		}, '<img src="angular{{version}}.jpg"/>').should.be.eql('module.exports = "<img src=\\"angular{{version}}.jpg\\"/>";');
+	});
+
+	it("should ignore files specified by multiple filters", function() {
+		loader.call({
+			options: {
+				htmlLoader: {
+					ignoreFiles: [
+						function(fileName) {
+							return /{{.*?}}/.test(fileName);
+						},
+						/no-hash/,
+					]
+				}
+			}
+		}, '<img src="angular{{version}}.jpg"/><img src="no-hash.png"/>').should.be.eql('module.exports = "<img src=\\"angular{{version}}.jpg\\"/><img src=\\"no-hash.png\\"/>";');
+	});
+
 	it("should export as default export for es6to5 transpilation", function() {
 		loader.call({
 			query: "?exportAsDefault"