EJS Causing Render Error after converting from HTML

Question

This is a few snippets of a much larger project I've been at for over a month. I'm about 6 hours into troubleshooting and everything is blending together.

Before converting to EJS everything worked perfect.

I'm not looking for an outright solve , but I'm brand new to EJS so a point in the right direction would save me before I revert back to Vanilla JS on HTML. Something here has to be wrong.

Errors:

ReferenceError: Invalid left-hand side in assignment at new Function () at Template.compile (/home/bob/Documents/Programming/Portfolio/node_modules/ejs/lib/ejs.js:626:12) at Object.compile (/home/bob/Documents/Programming/Portfolio/node_modules/ejs/lib/ejs.js:366:16) at handleCache (/home/bob/Documents/Programming/Portfolio/node_modules/ejs/lib/ejs.js:215:18) at tryHandleCache (/home/bob/Documents/Programming/Portfolio/node_modules/ejs/lib/ejs.js:254:16) at View.exports.renderFile [as engine] (/home/bob/Documents/Programming/Portfolio/node_modules/ejs/lib/ejs.js:459:10) at View.render (/home/bob/Documents/Programming/Portfolio/node_modules/express/lib/view.js:135:8) at tryRender (/home/bob/Documents/Programming/Portfolio/node_modules/express/lib/application.js:640:10) at Function.render (/home/bob/Documents/Programming/Portfolio/node_modules/express/lib/application.js:592:3) at ServerResponse.render (/home/name/Documents/Programming/Portfolio/node_modules/express/lib/response.js:1012:7)

.ejs file:

<!DOCTYPE html>
<html lang="en">

<head>
  <title>Services</title>
  <meta name="services" contents="Services Page">
  <link rel="stylesheet" href="styles.css" />
  <script src="store.js" async></script>
</head>

<body>
  <header class="main-header">
    <nav class="nav main-nav">
      <ul>
        <li><a href="index.html">HOME</a></li>
        <li><a href="services.html">SERVICES</a></li>
        <li><a href="about.html">ABOUT</a></li>
      </ul>
    </nav>
    <h1 class="my-name my-name-large">My Name</h1>
  </header>

  <section class="container content-section">
    <h2 class="section-header">STARTUP</h2>
    <div class="service-items">
      <% items.startup.forEach(function(item){ %>
        <div class="service-item shop-item" data-item-id="<%= item.id %>">
          <span class="service-item-title"><%= item.name %></span>
          <img class="service-item-image" src="Images/Services/<%= item.imgName %>" height="96px" width="96px">
          <div class="service-item-details">
            <span class="service-item-price">$<%= item.price /1= 100 %></span>
            <button class="btn btn-service shop-item-button" type="button">ADD TO CART</button>
          </div>
        </div>
        <% }) %>
    </div>
    <h2 class="section-header">RESOURCES</h2>
    <div class="service-items">
      <% items.startup.forEach(function(item){ %>
        <div class="service-item shop-item" data-item-id="<%= item.id %>">
          <span class="service-item-title"><%= item.name %></span>
          <img class="service-item-image" src="Images/Services/<%= item.imgName %>" height="96px" width="96px">
          <div class="service-item-details">
            <span class="service-item-price">$<%= item.price /1= 100 %></span>
            <button class="btn btn-service shop-item-button" type="button">ADD TO CART</button>
          </div>
        </div>
        <% }) %>
    </div>
    <h2 class="section-header">CONSULTING</h2>
    <div class="service-items">
      <% items.startup.forEach(function(item){ %>
        <div class="service-item shop-item" data-item-id="<%= item.id %>">
          <span class="service-item-title"><%= item.name %></span>
          <img class="service-item-image" src="Images/Services/<%= item.imgName %>" height="96px" width ="96px">
          <div class="service-item-details">
            <span class="service-item-price">$<%= item.price /1= 100 %></span>
            <button class="btn btn-service shop-item-button" type="button">ADD TO CART</button>
          </div>
        </div>
        <% }) %>
    </div>
  </section>

  <section class="container content-section">
    <h2 class="section-header">CART</h2>
    <div class="cart-items-header">
      <div class="service-item-details">
        <span class="cart-item cart-column-header cart-header">ITEM</span>
        <span class="cart-price cart-column-header cart-header">PRICE</span>
        <span class="cart-quantity cart-column-header cart-header">QUANTITY</span>
      </div>
    </div>
    <div>
      <div class="cart-items">


      </div>
      <div class="cart-total">
        <strong class="cart-total-title">Total</strong>
        <span class="cart-total-price">$0.00</span>
        <button class="btn btn-primary btn-purchase" type="button">PURCHASE</button>
      </div>
    </div>
  </section>


  <footer class="main-footer">
    <div class="container main-footer-container">
      <h3 class="my-name">my-name</h3>
      <ul class="nav footer-nav">
        <li>
          <a href="mywebsite.com"><img src="./Images/Icons/Youtube.png" height="48px" width="48px"></a>
        </li>
        <li>
          <a href="mailto:[email protected]" target="_blank"><img src="./Images/Icons/Gmail.png" height="48px" width="48px"></a>
        </li>
        <li>
          <a href="https://www.github.com/716green" target="_blank"><img src="./Images/Icons/Github.png" height="48px" width="48px"></a>
        </li>
      </ul>
    </div>
  </footer>
</body>

</html>

Abdulsattar Mohammed Abdulsattar Mohammed · Accepted Answer · 2020-02-09T06:54:47

It's this line:

<span class="service-item-price">$<%= item.price /1= 100 %></span>

You probably meant

<span class="service-item-price">$<%= item.price / 100 %></span>

EJS Causing Render Error after converting from HTML

1 Answers