EJS

Modelli JavaScript incorporati

Installazione

1$ npm install ejs

Caratteristiche

Controlla il flusso con <% %>
Uscita con <%= %>escape con (funzione di escape configurabile)
Output raw senza escape con <%- %>
Modalità newline-trim ("newline slurping") con -%>tag finale
Modalità di taglio degli spazi bianchi (slurp tutti gli spazi bianchi) per il controllo del flusso con <%_ _%>
Delimitatori personalizzati (ad es. utilizzare al <? ?>posto di <% %>)
Include
Supporto lato client
Cache statica di JavaScript intermedio
Cache statica dei modelli
Conforme al sistema di visualizzazione Express

Esempio

1
2
3
<% if (user) { %>
  <h2><%= user.name %></h2>
<% } %>

Prova EJS online su: https://ionicabizau.github.io/ejs-playground/ .

Utilizzo

1
2
3
4
5
6
7
8
9
10
let template = ejs.compile(str, options);
template(data);
// => Rendered HTML string

ejs.render(str, data, options);
// => Rendered HTML string

ejs.renderFile(filename, data, options, function(err, str){
    // str => Rendered HTML string
});

È anche possibile utilizzare ejs.render(dataAndOptions);dove passi tutto in un singolo oggetto.In tal caso, ti ritroverai con variabili locali per tutte le opzioni passate.Tuttavia, tieni presente che il tuo codice potrebbe rompersi se aggiungiamo un'opzione con lo stesso name come una delle proprietà dell'oggetto dati. Pertanto, non è consigliabile utilizzare questa scorciatoia.

Opzioni

cache Le funzioni compilate sono memorizzate nella cache, richiede filename
filename Il nome del file renderFile()di cui cacheeseguire il rendering. Non richiesto se si utilizza . Utilizzato da per le cache chiave e per le inclusioni.
root Imposta la radice del progetto per include con un percorso assoluto (/file.ejs).
context Contesto di esecuzione della funzione
compileDebug Quando falsenon viene compilata alcuna strumentazione di debug
client When true, compila una funzione che può essere resa nel browser senza dover caricare EJS Runtime ( ejs.min.js ).
delimiter Carattere da usare con parentesi angolari per apri/chiudi
debug Corpo della funzione generato dall'output
strict Quando è impostata su true, la funzione generata è in modalità rigorosa
_with Se utilizzare o meno i with() {}costrutti. In caso falseaffermativo, i locali verranno archiviati localsnell'oggetto. Impostato su falsein modalità rigorosa.
localsName Nome da utilizzare per l'oggetto che memorizza le variabili locali quando non si utilizza withDefaults tolocals
rmWhitespace Rimuove tutti gli spazi bianchi sicuri da rimuovere, inclusi gli spazi iniziali e finali.Abilita inoltre una versione più sicura di -%>slurping di riga per tutti i tag scriptlet (non rimuove le nuove righe di tag nel mezzo di una riga).
escape La funzione di escape utilizzata con <%=construct.È utilizzata nel rendering ed è .toString()ed è ed è nella generazione delle funzioni client (per impostazione predefinita, l'escape XML).
outputFunctionName Impostato su una stringa (ad es.,'echo' o'print') per una funzione per stampare l'output all'interno dei tag scriptlet.

Questo progetto utilizza JSDoc . Per la documentazione completa dell'API pubblica, clona il repository ed esegui npm run doc. Questo eseguirà JSDoc con le opzioni appropriate e restituirà la documentazione a out/. Se desideri sia i documenti API pubblici che quelli privati, esegui npm run devdocinvece.

Include

Gli include devono essere un percorso assoluto o, in caso contrario, devono essere considerati relativi al modello con la includechiamata.Ad esempio, se includi ./views/user/show.ejsda ./views/users.ejs, utilizzerai <%- include('user/show') %>.

È necessario specificare l' filenameopzione per il modello con la include chiamata, a meno che non si utilizzi renderFile().

Probabilmente vorrai utilizzare il tag di output non elaborato ( <%-) con la tua inclusione per evitare il doppio escape dell'output HTML.

1
2
3
4
5
<ul>
  <% users.forEach(function(user){ %>
    <%- include('user/show', {user: user}) %>
  <% }); %>
</ul>

Le inclusioni vengono inserite in fase di esecuzione, quindi è possibile utilizzare le variabili per il percorso nella includechiamata (ad esempio <%- include(somePath) %>).Le variabili nell'oggetto dati di livello superiore sono disponibili per tutte le inclusioni, ma le variabili locali devono essere passate.

NOTA: le direttive del preprocessore Includi ( <% include user/show %>) sono ancora supportate.

Delimitatori personalizzati

I delimitatori personalizzati possono essere applicati in base al modello o globalmente:

1
2
3
4
5
6
7
8
9
10
11
let ejs = require('ejs'),
    users = ['geddy', 'neil', 'alex'];

// Just one template
ejs.render('<?= users.join(" | "); ?>', {users: users}, {delimiter: '?'});
// => 'geddy | neil | alex'

// Or globally
ejs.delimiter = '$';
ejs.render('<$= users.join(" | "); $>', {users: users});
// => 'geddy | neil | alex'

memorizzazione nella cache

EJS viene fornito con una cache in-process di base per la memorizzazione nella cache delle funzioni JavaScript intermedie utilizzate per il rendering dei modelli.È facile collegare la cache LRU utilizzando la lru-cachelibreria di Node :

1
2
3
let ejs = require('ejs'),
    LRU = require('lru-cache');
ejs.cache = LRU(100); // LRU cache with 100-item limit

Se vuoi cancellare la cache EJS, chiama ejs.clearCache.Se stai usando la cache LRU e hai bisogno di un limite diverso, reimposta semplicemente ejs.cacheuna nuova istanza di LRU.

Caricatore di file personalizzato

Il caricatore di file predefinito è fs.readFileSync, se vuoi personalizzarlo, puoi impostare ejs.fileLoader.

1
2
3
4
5
6
let ejs = require('ejs');
let myFileLoad = function (filePath) {
  return 'myFileLoad: ' + fs.readFileSync(filePath);
};

ejs.fileLoader = myFileLoad;

Con questa funzione, puoi preelaborare il modello prima di leggerlo.

layout

EJS non supporta specificamente i blocchi, ma i layout possono essere implementati includendo intestazioni e piè di pagina, in questo modo:

1
2
3
4
5
6
7
8
<%- include('header') -%>
<h1>
  Title
</h1>
<p>
  My page
</p>
<%- include('footer') -%>

Supporto lato client

Vai all'ultima versione , scarica ./ejs.jso ./ejs.min.js.In alternativa, puoi compilarlo da solo clonando il repository ed eseguendo jake build(o $(npm bin)/jake buildse jake non è installato globalmente).

Includi uno di questi file nella tua pagina e ejsdovrebbe essere disponibile a livello globale.

Example

1
2
3
4
5
6
7
8
9
10
<div id="output"></div>
<script src="ejs.min.js"></script>
<script>
  let people = ['geddy', 'neil', 'alex'],
      html = ejs.render('<%= people.join(", "); %>', {people: people});
  // With jQuery:
  $('#output').html(html);
  // Vanilla JS:
  document.getElementById('output').innerHTML = html;
</script>

Caveats

La maggior parte di EJS funzionerà come previsto; tuttavia, ci sono alcune cose da notare:

Obviously, poiché non hai accesso al filesystem, ejs.renderFile()non funzionerà.

Per lo stesso motivo, includes non funziona a meno che non utilizzi un include callback.Ecco un esempio:

1
2
3
4
5
6
7
8
9
let str = "Hello <%= include('file', {person: 'John'}); %>",
   fn = ejs.compile(str, {client: true});

fn(data, null, function(path, d){ // include callback
 // path -> 'file'
 // d -> {person: 'John'}
 // Put your code here
 // Return the contents of file as a string
}); // returns rendered string

IDE Integration with Syntax Highlighting

VSCode:Javascript EJS di DigitalBrainstem

Esistono numerose implementazioni di EJS:

L'implementazione di TJ, la v1 di questa libreria: https://github.com/tj/ejs
EJS di Jupiter Consulting: http://www.embeddedjs.com/
EJS Embedded JavaScript Framework su Google Code: https://code.google.com/p/embeddedjavascript/
Implementazione Ruby di Sam Stephenson: https://rubygems.org/gems/ejs
Erubis, un'implementazione ERB che esegue anche JavaScript: http://www.kuwata-lab.com/erubis/users-guide.04.html#lang-javascript
Supporto per il linguaggio EJS di DigitalBrainstem: https://github.com/Digitalbrainstem/ejs-grammar

Licenza

Concesso in licenza con la licenza Apache, versione 2.0 ( http://www.apache.org/licenses/LICENSE-2.0 )

EJS Embedded JavaScript templates copyright 2112 mde@fleegix.org .

Guida allo sviluppo

Modulo base

Oggetti incorporati

Modulo comunitario

EJS

Installazione

Caratteristiche

Esempio

Utilizzo

Opzioni

tag

Include

Delimitatori personalizzati

memorizzazione nella cache

Caricatore di file personalizzato

layout

Supporto lato client

Example

Caveats

IDE Integration with Syntax Highlighting

Licenza

Guida allo sviluppo

Modulo base

Oggetti incorporati

Modulo comunitario

EJS

Installazione

Caratteristiche

Esempio

Utilizzo

Opzioni

tag

Include

Delimitatori personalizzati

memorizzazione nella cache

Caricatore di file personalizzato

layout

Supporto lato client

Example

Caveats

IDE Integration with Syntax Highlighting

Progetti correlati

Licenza