web-dev-qa-db-fra.com

Comment utiliser HTML comme moteur de visualisation dans Express?

J'ai essayé ce changement simple à partir de la graine et créé les fichiers .html correspondants (par exemple, index.html).

//app.set('view engine', 'jade');
app.set('view engine', 'html');

et ce fichier est resté le même:

exports.index = function(req, res){
  res.render('index');
};

mais en courant je reçois

Erreur 500: impossible de trouver le module 'html'

Est-ce que ma seule option est d'utiliser "ejs"? Mon intention était d'utiliser du HTML simple en conjonction avec AngularJS.

107
Julio

Les réponses sur l'autre lien fonctionneront, mais pour diffuser du HTML, il n'est pas du tout nécessaire d'utiliser un moteur de visualisation, sauf si vous souhaitez configurer un routage génial. Au lieu de cela, utilisez simplement le middleware statique:

app.use(express.static(__dirname + '/public'));
78
dankohn

Pour que le moteur de rendu accepte le code HTML au lieu de jade, procédez comme suit:

  1. Installez consolider et swig dans votre répertoire.

     npm install consolidate
     npm install swig
    
  2. ajoutez les lignes suivantes à votre fichier app.js

    var cons = require('consolidate');
    
    // view engine setup
    app.engine('html', cons.swig)
    app.set('views', path.join(__dirname, 'views'));
    app.set('view engine', 'html');
    
  3. ajoutez vos modèles de vue au format .html dans le dossier «views». Redémarrez votre serveur de nœud et démarrez l'application dans le navigateur.

Bien que cela rende le HTML sans problème, je vous recommanderais d’utiliser JADE en l’apprenant. Jade est un formidable moteur de templates et cet apprentissage vous aidera à améliorer la conception et l'évolutivité.

28
AnandShanbhag

Dans vos applications, ajoutez simplement

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');

Maintenant, vous pouvez utiliser le moteur de visualisation ejs tout en conservant vos fichiers de vue au format .html

source: http://www.makebetterthings.com/node-js/how-to-use-html-with-express-node-js/

Vous devez installer ces deux packages:

`npm install ejs --save`
`npm install path --save`

Et puis importez les paquets nécessaires:

`var path = require('path');`


De cette façon, vous pouvez enregistrer vos vues au format .html au lieu de .ejs.
Très utile lorsque vous travaillez avec des IDE qui prennent en charge le langage HTML mais ne reconnaissent pas les ejs.

17
Sudhanshu Gupta

essayez ceci pour la configuration de votre serveur

app.configure(function() {
    app.use(express.static(__dirname + '/public'));         // set the static files location
    app.use(express.logger('dev'));                         // log every request to the console
    app.use(express.bodyParser());                          // pull information from html in POST
    app.use(express.methodOverride());                      // simulate DELETE and PUT
    app.use(express.favicon(__dirname + '/public/img/favicon.ico'));
});

alors vos fonctions de rappel sur les routes ressembleront à ceci:

function(req, res) {
    res.sendfile('./public/index.html');
};
14
Connor Leech

Aucun moteur de vue n'est nécessaire si vous souhaitez utiliser angular avec un simple fichier html. Voici comment procéder: Dans votre fichier route.js:

router.get('/', (req, res) => {
   res.sendFile('index.html', {
     root: 'yourPathToIndexDirectory'
   });
});
12
Ashish Rawat

La réponse est très simple . Vous devez utiliser app.engine ('html') pour restituer les pages * .html . Essayez ceci.

app.set('views', path.join(__dirname, 'views'));
**// Set EJS View Engine**
app.set('view engine','ejs');
**// Set HTML engine**
app.engine('html', require('ejs').renderFile);

le fichier .html fonctionnera

4
Dinesh Kanivu

Les fichiers HTML peuvent être rendus à l'aide du moteur ejs:

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

Et assurez-vous que vos fichiers sous "/ views" portent le nom ".ejs".

Par exemple "index.ejs".

3
JerryFZhang

Pour que le moteur de rendu accepte le code HTML au lieu de jade, procédez comme suit:

Install consolidate and swig to your directory.

 npm install consolidate
 npm install swig

add following lines to your app.js file

var cons = require('consolidate');

// view engine setup
app.engine('html', cons.swig)
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'html');

add your view templates as .html inside “views” folder. Restart you node server and start the app in the browser.

Cela devrait marcher

Mettez en commentaire le middleware pour HTML, c.-à-d.

//app.set('view engine', 'html');

Utilisez plutôt:

app.get("/",(req,res)=>{
    res.sendFile("index.html");
});
0
Shivam Chhetri

html n'est pas un moteur de vue, mais ejs offre la possibilité d'écrire du code html en son sein

0
Wael Chorfan

Je recommande d'utiliser https://www.npmjs.com/package/express-es6-template-engine - un moteur de templates extrêmement léger et extrêmement rapide. Le nom est un peu trompeur car il peut aussi fonctionner sans expressjs.

Les bases nécessaires pour intégrer express-es6-template-engine dans votre application sont assez simples et faciles à implémenter: 

const express = require('express'),
  es6Renderer = require('express-es6-template-engine'),
  app = express();
  
app.engine('html', es6Renderer);
app.set('views', 'views');
app.set('view engine', 'html');
 
app.get('/', function(req, res) {
  res.render('index', {locals: {title: 'Welcome!'}});
});
 
app.listen(3000);
Voici le contenu du fichier index.html situé dans votre répertoire 'views':

<!DOCTYPE html>
<html>
<body>
    <h1>${title}</h1>
</body>
</html>
0
didinko

Essayez cette solution simple, cela a fonctionné pour moi

app.get('/', function(req, res){
    res.render('index.ehtml')
  });
0
Kiryamwibo Yenusu

serveur pages HTML via le routage, je l'ai fait.

var hbs = require('express-hbs');
app.engine('hbs', hbs.express4({
  partialsDir: __dirname + '/views/partials'
}));
app.set('views', __dirname + '/views');
app.set('view engine', 'hbs');

et renommé mes fichiers .html en fichiers .hbs - le guidon prend en charge le format HTML

0
Avinash