EJS

Modelli JavaScript incorporati

Installazione

1$ npm install ejs

Caratteristiche

Flusso di controllo con <% %>
Uscita di escape con <%= %> (funzione di escape configurabile)
Output grezzo senza escape con <%- %>
Modalità di taglio della nuova riga ('slurping della nuova linea') con tag -%> finale
Modalità di taglio degli spazi bianchi (slurp tutto lo spazio bianco) per il flusso di controllo con <%_ _%>
Custom delimiters (eg , utilizzare <? ?> Anziché <% %> )
include
Supporto lato client
Memorizzazione nella cache statica di JavaScript intermedio
Memorizzazione nella cache statica dei modelli
Conforme al sistema di visualizzazione Express

Esempio

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

Prova EJS online all'indirizzo: https://ionicabizau.github.io/ejs-playground/ .

uso

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 usare ejs.render(dataAndOptions); dove passi tutto in un singolo oggetto. In tal caso, finirai con le variabili locali per tutte le opzioni passate. Tuttavia, tieni presente che il tuo codice potrebbe rompersi se aggiungiamo un'opzione con lo stesso nome di una delle proprietà dell'oggetto dati, pertanto non è consigliabile utilizzare questo collegamento.

Opzioni

cache funzioni compilate vengono memorizzate nella cache, richiede il filename
filename Il nome del file in fase di rendering. Non richiesto se si utilizza renderFile() . Utilizzato dalla cache per la cache nella cache delle chiavi e per le renderFile() .
root Imposta la root progetto per include con un percorso assoluto (/file.ejs).
context Contesto di esecuzione della funzione
compileDebug Quando false non viene compilata alcuna strumentazione di debug
client Se true , compila una funzione che può essere renderizzata nel browser senza dover caricare EJS Runtime ( ejs.min.js ).
delimiter Carattere da utilizzare con parentesi angolari per apertura / chiusura
debug Corpo funzione generato dall'output
strict Se impostato su true , la funzione generata è in modalità rigorosa
_with Se utilizzare o meno with() {} costrutti with() {} . Se false i locali verranno archiviati nell'oggetto locals . Impostato su false in modalità rigorosa.
localsName Nome da utilizzare per l'oggetto che memorizza le variabili locali quando non viene utilizzato with localsName predefiniti per i locals
rmWhitespace Rimuovi tutto lo spazio bianco sicuro da rimuovere, incluso lo spazio bianco iniziale e finale e consente anche una versione più sicura di -%> slurping di linea per tutti i tag scriptlet (non rimuove le nuove linee di tag nel mezzo di una riga).
escape La funzione di escape utilizzata con <%= costrutto Viene utilizzata per il rendering ed è .toString() nella generazione di funzioni client (per impostazione predefinita, .toString() XML).
outputFunctionName Impostato su una stringa (ad esempio, 'echo' outputFunctionName ') per una funzione per stampare l'output all'interno dei tag scriptlet.

Questo progetto utilizza JSDoc . Per la documentazione API pubblica completa, clonare il repository ed eseguire npm run doc . Questo eseguirà JSDoc con le opzioni appropriate e produrrà la documentazione in out/ . Se si desidera che i documenti API sia pubblici che privati, eseguire npm run devdoc invece npm run devdoc .

include

Le inclusioni devono essere un percorso assoluto o, in caso contrario, sono considerate relative al modello con la chiamata di include esempio se si include ./views/user/show.ejs da ./views/users.ejs userebbe <%- include('user/show') %> .

È necessario specificare l'opzione del filename per il modello con la chiamata include meno che non si usi 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, pertanto è possibile utilizzare le variabili per il percorso nella chiamata include (ad esempio <%- include(somePath) %> ). Le variabili nell'oggetto dati di livello superiore sono disponibili per tutte le inclusioni, ma le variabili locali devono essere tramandati.

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

Delimitatori personalizzati

I delimitatori personalizzati possono essere applicati in base al modello o a livello globale:

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'

caching

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 libreria lru-cache 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, resetta semplicemente ejs.cache a una nuova istanza di LRU.

Caricatore di file personalizzato

Il caricatore di file predefinito è fs.readFileSync , se si desidera personalizzarlo, è possibile 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, è possibile 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 ./ejs.js versione , scarica ./ejs.js o ./ejs.min.js . In alternativa, puoi compilarlo clonando il repository ed eseguendo jake build (o $(npm bin)/jake build se jake non lo è installato a livello globale).

Includi uno di questi file nella tua pagina e ejs dovrebbe 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 , dato che non hai accesso al filesystem, ejs.renderFile() non funzionerà.

Per lo stesso motivo, include s non funziona se non si utilizza 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 diverse implementazioni di EJS:

TJ's implementation , la v1 di questa libreria: https://github.com/tj/ejs
Jupiter Consulting's EJS : http://www.embeddedjs.com/
EJS Embedded JavaScript Framework on Google Code : https://code.google.com/p/embeddedjavascript/
Sam Stephenson's Ruby implementation : 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
DigitalBrainstem EJS Language support : https://github.com/Digitalbrainstem/ejs-grammar

Licenza

Licenza concessa in licenza Apache, Versione 2.0 ( http://www.apache.org/licenses/LICENSE-2.0 )

Modelli JavaScript incorporati EJS copyright 2112 mde@fleegix.org .

Guida allo sviluppo

Modulo base

Oggetti incorporati

Modulo comunitario

EJS

Installazione

Caratteristiche

Esempio

uso

Opzioni

tag

include

Delimitatori personalizzati

caching

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

uso

Opzioni

tag

include

Delimitatori personalizzati

caching

Caricatore di file personalizzato

layout

Supporto lato client

Example

Caveats

IDE Integration with Syntax Highlighting

Progetti correlati

Licenza