First Commit

2020-11-25 09:10:06 -08:00
commit 601e886c14
@@ -0,0 +1,27 @@
+var path = require('path');
+var express = require('express');
+var expressLayouts = require('..');
+
+var app = express();
+
+app.set('views', path.join(__dirname, 'views'));
+app.set('view engine', 'ejs');
+app.set('layout extractScripts', true)
+app.set('layout extractStyles', true)
+
+app.use(expressLayouts);
+
+app.get('/', function(req, res) {
+  res.locals = {
+    title: 'Example',
+    message: 'This is a message'
+  };
+  res.render('view', {
+    // additional locals, a custom layout, or other options can be defined here
+  });
+});
+
+var port = 3000;
+app.listen(port, function() {
+  console.log('Listening on http://localhost:%s/', port);
+});
@@ -0,0 +1,33 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title><%= title %></title>
+
+  <% /* Place any styles in the page in this section. */ %>
+  <%- style %>
+</head>
+<body>
+  <header>
+    <% /*
+    Define an required placeholder for the header.
+    If a page doesn't define a header, there will be an error when rendering.
+    */ %>
+    <%- header %>
+  </header>
+
+  <%- body %>
+
+  <footer>
+    <% /*
+    Define an optional placeholder for the footer.
+    If a page doesn't define a footer, this section will simply be empty.
+    */ %>
+    <%- defineContent('footer') %>
+  </footer>
+
+  <% /* Place any scripts contained in views at the end of the page. */ %>
+  <%- script %>
+</body>
+</html>
+
@@ -0,0 +1,37 @@
+<%- contentFor('header') %>
+<h1 class="page-title"><%= _locals.title %></h1>
+
+<%- contentFor('footer') %>
+<h1>This is the footer</h1>
+
+<% /*
+Content for the `body` section should either be the first thing defined
+in the view, or it has to be declared just like any other section.
+*/ %>
+<%- contentFor('body') %>
+
+This is part of the body.
+
+<% /*
+When style extraction is enabled, any custom styles that a page defines, will
+be extracted out of the content and made available in the specific placeholder.
+In our example, even though we're defining a <style> within the body, this will
+be placed, according to our layout, inside of the <head> element.
+<link> blocks to load external stylesheets are also extracted when the option
+is enabled.
+*/ %>
+
+<style>
+  .page-message { color: blue }
+</style>
+
+<% /*
+Like stylesheets, scripts can also be extracted.
+This script block will end up at the end of the HTML document.
+*/ %>
+<script>
+  // Script content!
+</script>
+
+<h1 class="page-message"><%= message %></h1>
+