Utilizzo di modelli di motori con Express

Un motore modello ti permette di utilizzare file di template statici nella tua applicazione. Al runtime, il modello del motore sostituisce le variabili in un modello di file con valori reali, e trasforma il modello in un file HTML inviato al client. Questo approccio rende più facile progettare una pagina HTML.

Il generatore di applicazioni Express utilizza Pug come predefinito, ma supporta anche Handlebars, e EJS, tra gli altri.

Per rendere i file dei modelli, imposta le seguenti proprietà delle impostazioni dell’applicazione, nel file app.js predefinito creato dal generatore:

views, la directory dove si trovano i file del modello. Eg: app.set('views', './views'). Questo valore predefinito è la directory views nella directory radice dell’applicazione.
view engine, il modello motore da usare. Ad esempio, per usare il motore modello Pug: app.set('view engine', 'pug').

Quindi installare il corrispondente pacchetto npm del motore del modello; per esempio per installare Pug:

$ npm install pug --save

Motori di modelli conformi ad espresso, come Pug esportano una funzione chiamata __express(filePath, options, callback), che res.render() chiama per rendere il codice del modello.

Alcuni modelli di motori non seguono questa convenzione. La libreria @ladjs/consolidate segue questa convenzione mappando tutti i popolari motori di template Node.js, e quindi funziona perfettamente all’interno di Express.

Dopo che il motore di visualizzazione è stato impostato, non è necessario specificare il motore o caricare il modulo del motore modello nella tua app; Express carica il modulo internamente, per esempio:

app.set('view engine', 'pug');

Quindi, crea un file modello Pug chiamato index.pug nella directory views, con il seguente contenuto:

html
  head
    title= title
  body
    h1= message

Crea un percorso per rendere il file index.pug. Se la proprietà view engine non è impostata, è necessario specificare l’estensione del file view. Altrimenti, puoi ometterlo.

app.get('/', (req, res) => {
  res.render('index', { title: 'Hey', message: 'Hello there!' });
});

Quando effettui una richiesta alla home page, il file index.pug verrà renderizzato come HTML.

La cache del motore di visualizzazione non memorizza in cache il contenuto dell’output del modello, solo il modello sottostante. La vista è ancora ri-renderizzata con ogni richiesta anche quando la cache è accesa.