Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript Express Basics (2015) Using Templates with Express Scaffolding Your Project’s Templates - adding “partials”

Bobby Verlaan
Bobby Verlaan
29,538 Points
Posted by Bobby Verlaan
Bobby Verlaan
29,538 Points

Do indentation settings of IDE cause the error: unexpected token "indent"?

HI'm trying to follow along with the course, but when I include the partial I get the following error: unexpected token "indent".

Is it possible the settings of tabs in Coda makes editing for Jade hard? If so, what tab settings should I use in order to make sure the indent error's don't reoccur? I'm using Coda2 with the settings Tab Width: 2 (the option 'use spaces instead of tabs' is not checked).

Below the template, the partial and the error message.

File: src/templates/layout.jade

doctype html
html(lang="en")
        head
                title Landing Page

        body#page-top
            include ./partials/_nav.jade
            block content

File: src/templates/partials/_nav.jade

            nav#mainNav.navbar.navbar-default.navbar-fixed-top
                    .container-fluid
                        // Brand and toggle get grouped for better mobile display
                        .navbar-header
                            button.navbar-toggle.collapsed(type='button', data-toggle='collapse', data-target='#bs-example-navbar-collapse-1')
                                span.sr-only Toggle navigation
                                |                     
                                span.icon-bar
                                |                     
                                span.icon-bar
                                |                     
                                span.icon-bar
                            |                 
                            a.navbar-brand.page-scroll(href='/') FitLog.io
                        // Collect the nav links, forms, and other content for toggling
                        #bs-example-navbar-collapse-1.collapse.navbar-collapse
                            ul.nav.navbar-nav.navbar-right
                                li
                                        a(href='/blog') Blog
                                li
                                        a.page-scroll(href='#about') About
                                li
                                        a.page-scroll(href='#services') Services
                                |                     
                                li
                                        a.page-scroll(href='#portfolio') Portfolio
                                |                     
                                li
                                        a.page-scroll(href='#contact') Contact
                                // /.navbar-collapse
                                // /.container-fluid

Below you find my more elaborate error message:

Error: /Users/bobbyverlaan/Documents/Websites/www.test.dev/express-basics/express-basics/src/templates/partials/_nav.jade:2
   1| nav#mainNav.navbar.navbar-default.navbar-fixed-top
 > 2| .container-fluid
   3| // Brand and toggle get grouped for better mobile display
   4| .navbar-header
   5| button.navbar-toggle.collapsed(type='button', data-toggle='collapse', data-target='#bs-example-navbar-collapse-1')

unexpected token "indent"
   at Parser.parseExpr (/Users/bobbyverlaan/Documents/Websites/www.test.dev/express-basics/express-basics/node_modules/jade/lib/parser.js:254:15)
   at Parser.parse (/Users/bobbyverlaan/Documents/Websites/www.test.dev/express-basics/express-basics/node_modules/jade/lib/parser.js:122:25)
   at Parser.parseInclude (/Users/bobbyverlaan/Documents/Websites/www.test.dev/express-basics/express-basics/node_modules/jade/lib/parser.js:616:22)
   at Parser.parseExpr (/Users/bobbyverlaan/Documents/Websites/www.test.dev/express-basics/express-basics/node_modules/jade/lib/parser.js:223:21)
   at Parser.block (/Users/bobbyverlaan/Documents/Websites/www.test.dev/express-basics/express-basics/node_modules/jade/lib/parser.js:729:25)
   at Parser.tag (/Users/bobbyverlaan/Documents/Websites/www.test.dev/express-basics/express-basics/node_modules/jade/lib/parser.js:838:24)
   at Parser.parseTag (/Users/bobbyverlaan/Documents/Websites/www.test.dev/express-basics/express-basics/node_modules/jade/lib/parser.js:759:17)
   at Parser.parseExpr (/Users/bobbyverlaan/Documents/Websites/www.test.dev/express-basics/express-basics/node_modules/jade/lib/parser.js:211:21)
   at Parser.block (/Users/bobbyverlaan/Documents/Websites/www.test.dev/express-basics/express-basics/node_modules/jade/lib/parser.js:729:25)
   at Parser.tag (/Users/bobbyverlaan/Documents/Websites/www.test.dev/express-basics/express-basics/node_modules/jade/lib/parser.js:838:24)

4 Answers

Bobby Verlaan
Bobby Verlaan
29,538 Points
Bobby Verlaan
Bobby Verlaan
29,538 Points

looks like the video with Huston went so fast I missed the way he corrected the indentation when copying code to the partial file. Found the solution in checking out the next project in the GIT repo (git checkout settingUpStaticServer). It shows the partials are not indented. E.g. Notice the _head.jade partial being included below

doctype html
html(lang="en")
        include ./partials/_head.jade

        body#page-top
            include ./partials/_nav.jade
            block content

The two indentations that were previously there should be removed in the partial like so:

head
    title Landing Page 
    // all static goes here!

Lesson learned: partials should be starting at zero indentation.

Juan Ferr
Juan Ferr
13,220 Points
Juan Ferr
Juan Ferr
13,220 Points

really nice..... It makes sense my friend. I was worrying about all the kind of problems identation inside partials would bring us, cause otherwise you would have to calculate where it's included to know if it has to be identated or not.....good

Juan Ferr
Juan Ferr
13,220 Points
Juan Ferr
Juan Ferr
13,220 Points

really nice..... It makes sense my friend. I was worrying about all the kind of problems identation inside partials would bring us, cause otherwise you would have to calculate where it's included to know if it has to be identated or not.....good

Matthew Day
Matthew Day
6,740 Points
Matthew Day
Matthew Day
6,740 Points

Thanks for pointing this out!

Allison Walker
Allison Walker
17,137 Points
Allison Walker
Allison Walker
17,137 Points

Yes, I also got an error. But it was because one of my files had both spaces and indents. Can only use one!

alex mattingley
alex mattingley
7,508 Points
alex mattingley
alex mattingley
7,508 Points

Its not just coda, its sublime too! The only way I was able to solve this error, was to put a newline at the beginning of the file and then bring the first written line as far left as it could come. In other words, that second line cannot have any indentation. Edit: NVM you do not need a newline at the top of the document, you just need to make sure the first line has no indentation.

Jonathan Ankiewicz
Jonathan Ankiewicz
17,901 Points
Jonathan Ankiewicz
Jonathan Ankiewicz
17,901 Points

Thank you. I wish they would make not in the video even more so now that this is part of a certification course.