knockout-template-loader - npm Package Compare versions

Comparing version 2.0.0 to 3.0.0

lib/index.js

@@ -6,11 +6,24 @@ "use strict";
 function loaderFn(source) {
-	this.cacheable();
+  this.cacheable();
 
-	var sourcePart = source.replace("module.exports", "var htmlContent");
-	var options = utils.getOptions(this);
-	var name = (options ? options.name : null) || utils.interpolateName(this, "[name]-[ext]", {});
+  var sourcePart = source.replace("module.exports", "var htmlContent");
+  var options = utils.getOptions(this);
 
-	return ["var ko = require('knockout');", "var stringTemplateEngine = require('knockout-template-loader/lib/string-template-engine');", sourcePart, "ko.templates['" + name + "'] = htmlContent;"].join("\n");
+  var name = options && options.name || "[name]-[ext]";
+
+  if (typeof name === "function") {
+    name = name(utils.interpolateName(this, "[path][name].[ext]", {}));
+  }
+
+  name = utils.interpolateName(this, name, {});
+
+  var caseInsensitive = options && options.caseInsensitive;
+
+  if (caseInsensitive) {
+    name = name.toLowerCase();
+  }
+
+  return ["var ko = require('knockout');", "require('knockout-template-loader/lib/string-template-engine');", "ko.templateSources.stringTemplate.caseInsensitive = " + (caseInsensitive ? "true" : "false") + ";", sourcePart, "ko.templates['" + name + "'] = htmlContent;"].join("\n");
 }
 
 module.exports = loaderFn;

lib/string-template-engine.js

@@ -16,37 +16,52 @@ "use strict";
 _knockout2.default.templateSources.stringTemplate = function (template) {
-	this.templateName = template;
+  this.templateName = template;
 };
 
+_knockout2.default.templateSources.stringTemplate.caseInsensitive = false;
+
 _knockout2.default.utils.extend(_knockout2.default.templateSources.stringTemplate.prototype, {
-	data: function data(key, value) {
-		_data[this.templateName] = _data[this.templateName] || {};
+  data: function data(key, value) {
+    _data[this.templateName] = _data[this.templateName] || {};
 
-		if (arguments.length === 1) {
-			return _data[this.templateName][key];
-		}
+    if (arguments.length === 1) {
+      return _data[this.templateName][key];
+    }
 
-		_data[this.templateName][key] = value;
-	},
-	text: function text(value) {
-		if (arguments.length === 0) {
-			return templates[this.templateName];
-		}
+    _data[this.templateName][key] = value;
+  },
+  text: function text(value) {
+    if (arguments.length === 0) {
+      return templates[this.templateName];
+    }
 
-		templates[this.templateName] = value;
-	}
+    templates[this.templateName] = value;
+  }
 });
 
-engine.makeTemplateSource = function (template, doc) {
-	var elem;
-	if (typeof template === "string") {
-		elem = (doc || document).getElementById(template);
+engine.makeTemplateSource = function (template, templateDocument) {
+  // Named template
+  if (typeof template == "string") {
+    templateDocument = templateDocument || document;
 
-		if (elem) {
-			return new _knockout2.default.templateSources.domElement(elem);
-		}
+    var elem = templateDocument.getElementById(template);
+    if (elem) {
+      return new _knockout2.default.templateSources.domElement(elem);
+    }
 
-		return new _knockout2.default.templateSources.stringTemplate(template);
-	} else if (template && template.nodeType == 1 || template.nodeType == 8) {
-		return new _knockout2.default.templateSources.anonymousTemplate(template);
-	}
+    var templateName = template;
+    if (_knockout2.default.templateSources.stringTemplate.caseInsensitive) {
+      templateName = templateName.toLowerCase();
+    }
+
+    if (_knockout2.default.templates[templateName]) {
+      return new _knockout2.default.templateSources.stringTemplate(templateName);
+    }
+
+    throw new Error("Cannot find template with ID " + template);
+  } else if (template.nodeType == 1 || template.nodeType == 8) {
+    // Anonymous template
+    return new _knockout2.default.templateSources.anonymousTemplate(template);
+  } else {
+    throw new Error("Unknown template type: " + template);
+  }
 };
@@ -53,0 +68,0 @@

package.json

 {
   "name": "knockout-template-loader",
-  "version": "2.0.0",
+  "version": "3.0.0",
   "description": "Knockout html template loader for webpack",
@@ -5,0 +5,0 @@ "main": "lib/index.js",

README.md

@@ -13,12 +13,21 @@ # Knockout Template Loader for Webpack
 
-Either add it to your global `webpack.config.js`:
+Either add it to your global `webpack.config.js`, chaining after the `html-loader`:
 
 ```js
 {
-	module: {
-		loaders: [{
-			test: /\.html$/,
-			loader: "knockout-template!html"
-		}]
-	}
+  module: {
+    loaders: [{
+      test: /\.html$/,
+      use: [{
+        loader: "knockout-template-loader",
+        options: {
+          name: "[name]",
+          caseInsensitive: true
+        }
+      },
+      {
+        loader: "html-loader"
+      }]
+    }]
+  }
 }
@@ -33,6 +42,33 @@ ```
 
-By default, it will make the template available to knockout using the template's file name. If you want to override that, you can specify the `name` parameter:
+## Options
 
+### `name: string | function(string) => string`
+
+By default, the loader will make the template available to knockout using the template's file name. If you want to override that, you can specify the `name` parameter. 
+
+- Use a string value utilizing the available replacement tokens, like `[name]` for filename without extension. 
+- Pass a callback function which receives the full path of the HTML file being loaded and returns a name for the template. 
+
+**Examples**
+
 ```js
+...
+name: "[name]" // use file name without extension
+name: function(fullname) {
+  // use parent directory name + filename
+  var directoryName = path.basename(path.dirname(fullname));
+  var filename = path.basename(fullname).replace(/\.[^/.]+$/, "");
+  return directoryName + "-" + filename;
+}  
+...
+```
+
+Or using as an inline loader parameter:
+
+```js
 require("knockout-template?name=myBetterName!html!./my-template-file.html");
 ```
+
+### `caseInsensitive: boolean` (default: `false`)
+
+If set to `true`, the underlying template name resolution will happen case-insensitively, otherwise it will be case sensitive.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

96878

increased by48.28%

Lines of code

70

increased by40%

Number of lines in readme file

72

increased by94.59%

No dependency changes