jonathantnealESLit 
ESLit lets you write templates with embedded JavaScript expressions.
npm install eslit --save-devESLit templates are easy to use because they’re powered by web standards. Content is read as Template Literals with automatically resolving Promises.
<!-- some/template.html -->
<h1>${heading}</h1>
<table>
${people.map(person => `<tr>
<td>${person.given}</td>
<td>${person.family}</td>
</tr>`)}
</table>const eslit = require('eslit');
eslit('some/template', {
heading: Promise.resolve('Guest List'),
people: [{
given: 'Martin',
family: 'Brody'
}, {
given: 'Bruce',
family: 'Shark'
}]
}).then(console.log);<h1>Guest List</h1>
<table>
<tr>
<td>Martin</td>
<td>Brody</td>
</tr><tr>
<td>Bruce</td>
<td>Shark</td>
</tr>
</table>You can also use import functions to include other templates.
<h1>${heading}</h1>
<table>
${import('./some/table') /* includes some/table.html */}
</table>Alternatively, the include function lets you specify additional data.
<h1>${heading}</h1>
<table>
${import('./some/table', { additional: 'data' })}
</table>Usage
ESLit returns a Promise to render content once its embedded Promises are resolved.
eslit(src, data, options);- src: the path or package id being imported.
- data: the data used by the template.
- Options
- cwd: the path used by imports (default:
process.cwd()). - prefixes: the file prefixes sometimes used by imports (default:
[ "_" ]). - extensions: the file extensions sometimes used by imports (default:
[ ".html", ".jsx" ]). - globopts: the options passed into node-glob.
- cwd: the path used by imports (default:
Notes:
- Paths are relative to the current file or the current working directory.
- Paths may use glob patterns or omit prefixes and extensions
- Node modules are supported, using the package
templateormainkeys, or by usingindex.html
ESLit.parse
The parse function returns a promise to render the template string once its embedded promises are resolved.
eslit.parse( string, data, { cwd, prefixes, extensions, globopts } );string: The string parsed as a template.
ESLit.resolve
The resolve function returns a Promise that is resolved once its embedded promises have resolved.
eslit.resolve`Template literal to be ${Promise.resolve('resolved')}`;Syntax Helpers
Sublime Text
- Install the Babel Package.
- Select Tools > Developer > New Syntax.
- Paste this syntax.
- Save the file as
Lit Template (Babel).sublime-syntax.