eta (Ξ·)
Documentation -
Chat -
RunKit Demo -
Playground
!All Contributorslogo
You're viewing the source for Eta v3, which we just released! For v2, visit the old branch.
Summary
Eta is a lightweight and blazing fast embedded JS templating engine that works inside Node, Deno, and the browser. It's written in TypeScript and emphasizes great performance, configurability, and small bundle size.
π Features
- π¦ 0 dependencies
- π‘ Only ~3.5 KB minzipped
- β‘οΈ Written in TypeScript
- β¨ Deno support (+ Node and browser)
- π Super Fast
- π§ Configurable
- Plugins, custom delimiters, caching
- Precompilation, partials, async
- Layout support
!
- Better quotes/comments support- _ex._ `<%= someval + "string %>" %>` compiles correctly, while it fails with doT or EJS
- Great error reporting- β‘οΈ Exports ES Modules as well as UMD
- π Easy template syntax
Get Started
For more thorough documentation, visit https://eta.js.org
Install Eta
npm install eta
In the root of your project, create templates/simple.eta
Hi <%= it.name %>!
Then, in your JS file:
import { Eta } from "eta";
// import { Eta } from "https://deno.land/x/eta@v3.1.0/src/index.ts";
const eta = new Eta({ views: path.join(__dirname, "templates") });
// Render a template
const res = eta.render("./simple", { name: "Ben" });
console.log(res); // Hi Ben!
FAQs
<b>Where did Eta's name come from?</b>
"Eta" means tiny in Esperanto. Plus, it can be used as an acronym for all sorts of cool phrases: "ECMAScript Template Awesomeness", "Embedded Templating Alternative", etc....
Additionally, Eta is a letter of the Greek alphabet (it stands for all sorts of cool things in various mathematical fields, including efficiency) and is three letters long (perfect for a file extension).
Integrations
<b>Visual Studio Code</b>
@shadowtime2000 created
eta-vscode.
<b>ESLint</b>
eslint-plugin-eta was created to provide an ESLint processor so you can lint your Eta templates.
<b>Webpack</b>
Currently there is no official Webpack integration but
@clshortfuse shared the loader he uses:
{
loader: 'html-loader',
options: {
preprocessor(content, loaderContext) {
return eta.render(content, {}, { filename: loaderContext.resourcePath });
},
},
}
<b>Node-RED</b>
To operate with Eta templates in Node-RED:
@ralphwetzel/node-red-contrib-eta Projects using eta
Contributors
Made with β€ by
@nebrelbug and all these wonderful contributors (
emoji key):
<tr>
<td align="center" valign="top" width="14.28%"><a href="http://www.bengubler.com"><img src="https://avatars3.githubusercontent.com/u/25597854?v=4?s=100" width="100px;" alt="Ben Gubler"/><br /><sub><b>Ben Gubler</b></sub></a><br /><a href="https://github.com/eta-dev/eta/commits?author=nebrelbug" title="Code">π»</a> <a href="#question-nebrelbug" title="Answering Questions">π¬</a> <a href="https://github.com/eta-dev/eta/commits?author=nebrelbug" title="Documentation">π</a> <a href="https://github.com/eta-dev/eta/commits?author=nebrelbug" title="Tests">β οΈ</a></td>
<td align="center" valign="top" width="14.28%"><a href="https://github.com/clitetailor"><img src="https://avatars1.githubusercontent.com/u/16368559?v=4?s=100" width="100px;" alt="Clite Tailor"/><br /><sub><b>Clite Tailor</b></sub></a><br /><a href="#ideas-clitetailor" title="Ideas, Planning, & Feedback">π€</a> <a href="https://github.com/eta-dev/eta/commits?author=clitetailor" title="Code">π»</a></td>
<td align="center" valign="top" width="14.28%"><a href="https://twitter.com/ioan_chiriac"><img src="https://avatars2.githubusercontent.com/u/173203?v=4?s=100" width="100px;" alt="Ioan CHIRIAC"/><br /><sub><b>Ioan CHIRIAC</b></sub></a><br /><a href="https://github.com/eta-dev/eta/commits?author=ichiriac" title="Code">π»</a> <a href="#ideas-ichiriac" title="Ideas, Planning, & Feedback">π€</a></td>
<td align="center" valign="top" width="14.28%"><a href="https://www.linkedin.com/in/craig-morten/"><img src="https://avatars1.githubusercontent.com/u/46491566?v=4?s=100" width="100px;" alt="Craig Morten"/><br /><sub><b>Craig Morten</b></sub></a><br /><a href="https://github.com/eta-dev/eta/commits?author=asos-craigmorten" title="Code">π»</a></td>
<td align="center" valign="top" width="14.28%"><a href="https://github.com/trojanh"><img src="https://avatars0.githubusercontent.com/u/22974490?v=4?s=100" width="100px;" alt="Rajan Tiwari"/><br /><sub><b>Rajan Tiwari</b></sub></a><br /><a href="#example-trojanh" title="Examples">π‘</a></td>
<td align="center" valign="top" width="14.28%"><a href="https://shadowtime2000.github.io"><img src="https://avatars1.githubusercontent.com/u/66655515?v=4?s=100" width="100px;" alt="shadowtime2000"/><br /><sub><b>shadowtime2000</b></sub></a><br /><a href="https://github.com/eta-dev/eta/commits?author=shadowtime2000" title="Code">π»</a> <a href="#ideas-shadowtime2000" title="Ideas, Planning, & Feedback">π€</a> <a href="https://github.com/eta-dev/eta/commits?author=shadowtime2000" title="Tests">β οΈ</a></td>
<td align="center" valign="top" width="14.28%"><a href="https://hamidihamza.com"><img src="https://avatars0.githubusercontent.com/u/22576950?v=4?s=100" width="100px;" alt="Hamza Hamidi"/><br /><sub><b>Hamza Hamidi</b></sub></a><br /><a href="https://github.com/eta-dev/eta/commits?author=hamzahamidi" title="Documentation">π</a></td>
</tr>
<tr>
<td align="center" valign="top" width="14.28%"><a href="http://calumk.com"><img src="https://avatars1.githubusercontent.com/u/1183991?v=4?s=100" width="100px;" alt="Calum Knott"/><br /><sub><b>Calum Knott</b></sub></a><br /><a href="#ideas-calumk" title="Ideas, Planning, & Feedback">π€</a></td>
<td align="center" valign="top" width="14.28%"><a href="https://github.com/nhaef"><img src="https://avatars.githubusercontent.com/u/16443053?v=4?s=100" width="100px;" alt="nhaef"/><br /><sub><b>nhaef</b></sub></a><br /><a href="https://github.com/eta-dev/eta/commits?author=nhaef" title="Code">π»</a></td>
<td align="center" valign="top" width="14.28%"><a href="http://heyhey.to/GΓΌn"><img src="https://avatars.githubusercontent.com/u/74139498?v=4?s=100" width="100px;" alt="GΓΌn"/><br /><sub><b>GΓΌn</b></sub></a><br /><a href="https://github.com/eta-dev/eta/commits?author=gurgunday" title="Code">π»</a></td>
</tr>
This project follows the
all-contributors specification. Contributions of any kind are welcome!
Credits
- Async support, file handling, and error formatting were based on code from EJS, which is licensed under the Apache-2.0 license. Code was modified and refactored to some extent.
- Syntax and some parts of compilation are heavily based off EJS, Nunjucks, and doT.