hbs file does not redraw

Navigation
0

I am making an application with backend Node.js and Handlebars . I'm having a hard time rendering the layout.hbs file, I've done some testing on the server.js and main.js files and the routes are ok . 

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../../favicon.ico">

    <title>Realtime Twitter</title>

    <!-- Bootstrap core CSS -->
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

    <link href="/css/starter-template.css" rel="stylesheet">

  </head>

  <body>

    <nav class="navbar navbar-inverse navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="#">Project name</a>
        </div>
        <div id="navbar" class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="#about">About</a></li>
            <li><a href="#contact">Contact</a></li>
          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </nav>

    <div class="container">

      <div class="starter-template">
        <h1>Bootstrap starter template</h1>
        <p class="lead">Use this document as a way to quickly start any new project.<br> All you get is this text and a mostly barebones HTML document.</p>
      </div>

    </div><!-- /.container -->


    <!-- Bootstrap core JavaScript
    ================================================== -->
    <!-- Placed at the end of the document so the pages load faster -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script><scriptsrc="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

  </body>
</html>

My complete project at GitHub .

Dependencies 

"dependencies": {
    "body-parser": "^1.18.2",
    "express": "^4.16.2",
    "express-handlebars": "^3.0.0",
    "hbs": "^4.0.1",
    "mongoose": "^4.13.7",
    "morgan": "^1.9.0"
  }
    
asked by anonymous 18.12.2017 / 00:47

1 answer

0

Your problem is in the line below in your serve.js file: 

app.engine('.hbs', express({ defaultLayout: 'layout', extname: '.hbs' }));

According to the documentation , when setting the view engine setting you must tell how parameter Template Engine which in case you are not doing, you are reporting Express itself. Just change express to expressHbs as in the code below. 

app.engine('.hbs', expressHbs({defaultLayout: 'layout',extname: '.hbs'}));

Reference

20.12.2017 / 04:58
Questions about Django MTV Do Load the photos from a specific directory in a texture c #