I have this error : RangeError: Maximum call stack size exceeded

I have this error while creating a webpage there is a part of this that webpage consisting a form in it but whenever I tried to open that form it shows this error –

RangeError: Maximum call stack size exceeded at Lexer.callLexerFunction (C:\Users\USER\Desktop\ansh_web\dance website\node_modules\pug-lexer\index.js:1642:23)
at Lexer.include (C:\Users\USER\Desktop\ansh_web\dance website\node_modules\pug-lexer\index.js:818:17) 
at Lexer.callLexerFunction (C:\Users\USER\Desktop\ansh_web\dance website\node_modules\pug-lexer\index.js:1642:23) 
at Lexer.advance (C:\Users\USER\Desktop\ansh_web\dance website\node_modules\pug-lexer\index.js:1667:12) 
at Lexer.callLexerFunction (C:\Users\USER\Desktop\ansh_web\dance website\node_modules\pug-lexer\index.js:1642:23) 
at Lexer.getTokens (C:\Users\USER\Desktop\ansh_web\dance website\node_modules\enter code herepug-enter code herelexer\index.js:1701:12)
at lex (C:\Users\USER\Desktop\ansh_web\dance website\node_modules\pug-lexer\index.js:12:42) 
at Object.lex (C:\Users\USER\Desktop\ansh_web\dance website\node_modules\pug\lib\index.js:104:9) 
at Function.loadString [as string] (C:\Users\USER\Desktop\ansh_web\dance website\node_modules\pug-load\index.js:53:24) 
at C:\Users\USER\Desktop\ansh_web\dance website\node_modules\pug-load\index.js:37:27

Some part of my code is this it is js code and I’m a beginner so I don’t know how to solve this error.Please help me😒😒😒… :


    const express = require("express");
    const path = require("path");
    const app = express();
    const port = 8000;
    
    // Express specific stuffs 
     app.use('/static', express.static('static'))    // For serving Static Files
     app.use(express.urlencoded()) 
    
    // Pug specific stuffs
     app.set('view engine', 'pug')     // set the template engine as pug
     app.set('views', path.join(__dirname, 'views'))    // set the views directory 
    
    // Endpoints
     app.get('/', (req, res) => { 
        const params = {} 
        res.status(200).render('home.pug', params);
     }) 
     app.get('/contact', (req, res) => {
        const params = {} 
        res.status(200).render('contact.pug', params);
     }) 
    
     // Start the server
     app.listen(port, () => { 
          console.log(`The application started successfully on port ${port}`); 
     });

Here is my home.pug file


    extends base.pug
    
    block scripts
       scripts(scr='/static/index.js')
    
    block style
        style
          include ../static/style.css
    
    block content   
        section#info
          div Welcome To Anshs Dance Academy  
          div.small Eat,Sleep,Dance,Repeat...

        section#mission
          h2 Our Mission
          div.card
           h3 Dance Perfection
            div.card-box
              div.card-img
                img(src="/static/img/img1.png")
              div.card-content  
                p Lorem ipsum dolor sit amet.
          div.card
            h3 Dance the way you like
             div.card-box
              div.card-img
                img(src="/static/img/img2.png")
              div.card-content  
                p Lorem ipsum dolor sit amet.
          div.card
           h3 Expert teaching
             div.card-box
              div.card-img
                img(src="/static/img/img3.png")
              div.card-content  
                p Lorem ipsum dolor sit amet.
            
         section#sponsersSection
          h2 Our Sponsers
           div#sponsers
             img(src="/static/img/logo1.png", alt="sponsers images", class="spimg")
             img(src="/static/img/logo2.png", alt="sponsers images", class="spimg")
             img(src="/static/img/logo3.png", alt="sponsers images", class="spimg")
             img(src="/static/img/logo4.png", alt="sponsers images", class="spimg")

Here is my contact.pug file


    extends contact.pug
    
    block scripts
       scripts(scr='/static/index.js')
    
    block style   
        style
          include ../static/style.css
    
    block content      
        H1 Contact Us
         form(action="/contact", method= "post", class= "myForm")
            input(type="text" class= "myname" name="name" placeholder="Enter your name..")
            input(type="phone" class= "myInput" name="phone" placeholder="Enter your phone number..")
            input(type="email" class= "myInput" name="email" placeholder="Enter your email..")
            input(type="text" name="firstname" placeholder="Your name..")
            button(class="btn")
              | submit

1 thought on “I have this error : RangeError: Maximum call stack size exceeded”

  1. From a stack trace it looks like one of your *.pug files includes another .pug file and you have circular dependency (A includes B, B includes A) so the server crashes.

    Looking at contact.pug I can see that it extends itself by mistake (first line should be extends base.pug)

    extends base.pug
        
        block scripts
           scripts(scr='/static/index.js')
        
        block style   
            style
              include ../static/style.css
        
        block content      
            H1 Contact Us
             form(action="/contact", method= "post", class= "myForm")
                input(type="text" class= "myname" name="name" placeholder="Enter your name..")
                input(type="phone" class= "myInput" name="phone" placeholder="Enter your phone number..")
                input(type="email" class= "myInput" name="email" placeholder="Enter your email..")
                input(type="text" name="firstname" placeholder="Your name..")
                button(class="btn")
                  | submit
    
    Reply

Leave a Comment