How do I use HTML as the view engine in Express?

Html Problem Overview

I tried this simple change from the seed and created the corresponding .html files (e.g. index.html).

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

and this file remained the same:

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

but while running I get

500 Error: Cannot find module 'html'

Is my only option to use 'ejs'? My intent was to use plain HTML in conjuction with AngularJS.

Html Solutions

Solution 1 - Html

The answers at the other link will work, but to serve out HTML, there is no need to use a view engine at all, unless you want to set up funky routing. Instead, just use the static middleware:

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

Solution 2 - Html

To make the render engine accept html instead of jade you can follow the following steps;

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.

Though this will render html without any issue, I would recommend you to use JADE by learning it. Jade is an amazing template engine and learning this will help you achieve better design & scalability.

Solution 3 - Html

In your apps.js just add

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

Now you can use ejs view engine while keeping your view files as .html

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

You need to install this two packages:

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

And then import needed packages:

var path = require('path');

This way you can save your views as .html instead of .ejs.
Pretty helpful while working with IDEs that support html but dont recognize ejs.

Solution 4 - Html

No view engine is necessary, if you want to use angular with simple plain html file. Here's how to do it: In your route.js file:

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

Solution 5 - Html

try this for your server config

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'));
});

then your callback functions to routes will look like:

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

Solution 6 - Html

I recommend using https://www.npmjs.com/package/express-es6-template-engine - extremely lightwave and blazingly fast template engine. The name is a bit misleading as it can work without expressjs too.

The basics required to integrate express-es6-template-engine in your app are pretty simple and quite straight forward to implement:

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);

Here is the content of the index.html file locate inside your 'views' directory:

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

Solution 7 - Html

Comment out the middleware for html i.e.

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

Instead use:

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

Solution 8 - Html

Answer is very Simple. You Must use app.engine('html') to render *.html Pages. try this.It must Solve the Problem.

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);

the .html file Will work

Solution 9 - Html

Html files do not need to be rendered.
what a render engine does is turn a file that is not an Html file into an Html file.
to send an Html file, just do:

res.sendFile("index.html");

you might need to use __dirname+"/index.html" so express will know the exact path.

Solution 10 - Html

HTML files can be rendered using ejs engine:

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

And make sure your files under "/views" are named with ".ejs".

For example "index.ejs".

Solution 11 - Html

html is not a view engine , but ejs offers the possibility to write html code within it

Solution 12 - Html

Install ejs template

npm install ejs --save

Refer ejs in app.js

app.set('views', path.join(__dirname, 'views'));`
app.set('view engine', 'ejs');

Create a ejs template in views like views/indes.ejs & use ejs tempalte in router

router.get('/', function(req, res, next) {
    res.render('index', { title: 'Express' });
});

Solution 13 - Html

to server html pages through routing, I have done this.

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

and renamed my .html files to .hbs files - handlebars support plain html

Solution 14 - Html