Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

underscore-template-loader

Package Overview
Dependencies
Maintainers
1
Versions
23
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

underscore-template-loader - npm Package Compare versions

Comparing version 0.2.6 to 0.3.0

parser.js

99

index.js
var _ = require('underscore');
var path = require('path');
var fs = require('fs');
var url = require("url");
var loaderUtils = require('loader-utils');
var attributeParser = require('./parser');
module.exports = function() {
var loaderUtils = require('loader-utils');
var path = require('path');
var fs = require('fs');
var includeRegex = /<!--include\s+([\/\w\.]*?[\w]+\.[\w]+)-->/g;
module.exports = function () {
var includeRegex = /<@include\s+([\/\w\.]*?[\w]+\.[\w]+)>/g;
// Returns a template file content
var readFile = function(filepath, root) {

@@ -13,4 +16,5 @@ var self = readFile;

if (filepath in self.buffer)
if (filepath in self.buffer) {
return self.buffer[filepath];
}

@@ -22,2 +26,3 @@ var content = readContent(fs.readFileSync(path.join(root, filepath), 'utf8'), root);

// Parses an external file content
var readContent = function(content, root) {

@@ -37,14 +42,84 @@ var matches = includeRegex.exec(content);

return function(content) {
if (this.query.length) {
var query = loaderUtils.parseQuery(this.query);
_.each(query, function(value, key){
var query = loaderUtils.parseQuery(this.query);
var root = query.root;
var attributes = ['img:src'];
if (_.isObject(query)) {
// Apply template settings
_.each(_.pick(query, 'interpolate', 'escape', 'evaluate'), function (value, key) {
_.templateSettings[key] = new RegExp(value, 'g');
});
};
// Set tag+attribute to parse for external resources
if (query.attributes !== undefined) {
attributes = _.isArray(query.attributes) ? query.attributes : [];
}
// Set include regex
if (query.includeRegex !== undefined) {
includeRegex = new RegExp(query.includeRegex, 'g');
}
}
// Generates a random string for further proccessing
var randomIdent = function () {
return "@@@URL" + Math.random() + "@@@";
};
// Obtain external resource links
var links = attributeParser(content, function (tag, attr) {
return attributes.indexOf(tag + ':' + attr) >= 0;
});
links.reverse();
// Parse external resources
var data = {};
content = [content];
links.forEach(function (link) {
// Ignore absolute paths
if (/^\//.exec(link.value) && root == false) {
return;
}
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;
}
do {
var ident = randomIdent();
} while (data[ident]);
data[ident] = link.value;
var x = content.pop();
content.push(x.substr(link.start + link.length));
content.push(ident);
content.push(x.substr(0, link.start));
});
content.reverse();
content = content.join('');
this.cacheable && this.cacheable();
var callback = this.async();
// Read file content
content = readContent(content, this.context);
var fn = _.template(content);
callback(null, "module.exports = " + fn.source + ";");
// Replace random generated strings with require
var source = _.template(content).source;
content = source.replace(/@@@URL[0-9\.]+@@@/g, function (match) {
if (!data[match]) {
return match;
}
return "' + require(" + JSON.stringify(loaderUtils.urlToRequest(data[match], root)) + ") + '";
});
callback(null, "module.exports = " + content + ";");
};

@@ -51,0 +126,0 @@ }();

59

package.json
{
"name": "underscore-template-loader",
"version": "0.2.6",
"description": "A Underscore template loader for Webpack",
"main": "index.js",
"homepage": "https://github.com/emaphp/underscore-template-loader",
"bugs": {
"url": "https://github.com/emaphp/underscore-template-loader/issues"
},
"author": {
"name": "Emmanuel Antico",
"email": "emmanuel.antico@gmail.com"
},
"repository": {
"type": "git",
"url": "https://github.com/emaphp/underscore-template-loader.git"
},
"dependencies": {
"loader-utils": "^0.2.5"
},
"peerDependencies": {
"underscore": ">=1.5.0"
},
"keywords": [
"underscore",
"template",
"webpack",
"loader"
],
"readmeFilename": "README.md"
"name": "underscore-template-loader",
"version": "0.3.0",
"description": "An Underscore template loader for Webpack",
"main": "index.js",
"homepage": "https://github.com/emaphp/underscore-template-loader",
"bugs": {
"url": "https://github.com/emaphp/underscore-template-loader/issues"
},
"author": {
"name": "Emmanuel Antico",
"email": "emmanuel.antico@gmail.com"
},
"repository": {
"type": "git",
"url": "https://github.com/emaphp/underscore-template-loader.git"
},
"dependencies": {
"fastparse": "^1.1.1",
"loader-utils": "^0.2.11"
},
"peerDependencies": {
"underscore": ">=1.5.0"
},
"keywords": [
"underscore",
"template",
"webpack",
"loader"
],
"readmeFilename": "README.md"
}

150

README.md
underscore-template-loader
==========================
A Underscore template loader for Webpack
An Underscore.js template loader for Webpack
<br/>
###Usage
###Installation
<br/>
**Installation**
```bash

@@ -16,3 +15,6 @@ $ npm install underscore-template-loader

<br/>
**Add loader**
###Usage
<br/>
```javascript

@@ -23,9 +25,26 @@ module.exports = {

//...
{ test: /\.html/, loader: "underscore-template-loader" }
{ test: /\.html$/, loader: "underscore-template-loader" }
]
};
```
<br/>
**Set underscore template settings**
####Loading templates
<br/>
```html
<!-- file: hello.html -->
<p>Hello&nbsp;<%=name%></p>
```
```javascript
var compiled = require('./hello.html');
return compiled({name: "world"});
```
<br/>
####Template settings
<br>
```javascript
module.exports = {

@@ -36,8 +55,8 @@ //...

{
test: /\.html/,
test: /\.html$/,
loader: "underscore-template-loader",
query: {
interpolate : '\\{\\[(.+?)\\]\\}',
evaluate: '\\{%([\\s\\S]+?)%\\}',
escape : '\\{\\{(.+?)\\}\\}'
interpolate : '\\{\\[(.+?)\\]\\}',
evaluate: '\\{%([\\s\\S]+?)%\\}',
escape : '\\{\\{(.+?)\\}\\}'
}

@@ -50,32 +69,123 @@ }

<br/>
**Loading templates**
####Include tag
<br/>
```html
<!-- file: hello.html -->
<p>Hello&nbsp;<%=name%></p>
<!-- file: main.html -->
<p>Hello, <@include message.html></p>
```
```html
<!-- file: message.html -->
<em>how are you?</em>
```
<br/>
Include tag can be overrided through the *includeRegex* argument.
<br/>
```javascript
var compiled = require('./hello.html');
return compiled({name: "world"});
module.exports = {
//...
loaders: [
//...
{
test: /\.html$/,
loader: "underscore-template-loader",
query: {
includeRegex: '<#include\\s+([\\/\\w\\.]*?[\\w]+\\.[\\w]+)>'
}
}
]
};
```
<br/>
**Include tag**
####Images
<br/>
In order to load images you must install either the *file-loader* or the *url-loader* packages.
```javascript
module.exports = {
//...
loaders: [
//...
{ test: /\.html/, loader: "underscore-template-loader" },
{ test: /\.jpg$/, loader: "file-loader" },
{ test: /\.png$/, loader: "url-loader?mimetype=image/png" },
]
};
```
<br>
```html
<!-- file: main.html -->
<p>Hello, <!--include message.html--></p>
<!-- Require image using file-loader -->
<img src="img/portrait.jpg">
<!-- Require image using url-loader -->
<img src="img/icon.png">
```
<br/>
Images with an absolute path are not translated unless a *root* argument is defined
```html
<!-- file: message.html -->
<em>how are you?</em>
<!-- Using root = undefined => no translation -->
<img src="/not_translated.jpg">
<!-- Using root = 'images' => require('images/image.jpg') -->
<img src="/image.jpg">
```
<br>
In order to deactivate image processing define *attributes* as an empty array.
```javascript
module.exports = {
//...
loaders: [
//...
{
test: /\.html$/,
loader: "underscore-template-loader",
query: {
attributes: []
}
}
]
};
```
<br/>
You could also add which attributes need to be processed in the form of pairs *tag:attribute*.
```javascript
module.exports = {
//...
loaders: [
//...
{
test: /\.html$/,
loader: "underscore-template-loader",
query: {
attributes: ['img:src', 'x-img:src']
}
}
]
};
```
<br/>
####Known issues
<br/>
* Trying to use different template settings (interpolate, escape, evaluate) for different extensions. Underscore template settings are defined globally.
<br/>
###License
Released under the MIT license.
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc