SyntaxError: Unexpected token ) – Gulp Tasks not working for Sitecore Habitat

Sitecore Habitat using Helix principles is the new approach of developing Sitecore based solutions and even though we were a bit sceptical in developing this for a client we took the leap of faith.

After exploring & understanding the concept and watching a few videos (listed below), the team felt confident, found Habitat to be a logical and easy approach to develop a Sitecore solution.

Team started making good progress and I joined the team around sprint 5. Even though we were a bit optimistic on setting up our Habitat solution on my new development machine, we failed in the first go!

  • Sitecore code repository was pulled fine and configured locally.
  • Sitecore 8.2 Update 2 vanilla instance was setup and running!
  • Visual Studio Solution file opened up fine with building a solution working.

Issue was the Gulpfile.js failed to load in the Task Runner Explorer

Gulp Task Runner Sitecore Habitat I

The obvious, we started troubleshooting to resolve this issue; we tried:

  • Comparing the repository folders and paths
  • The content of files like gulp-config.js, gulpfile-ci.js and gulpfile.js files just to make sure we haven’t changed things.
  • Have I followed the Sitecore Habitat prerequisites and have the necessary resources on the development machine ?
  • Made sure that Visual Studio is running As Administrator. (I know it sounds like an obvious one but can get you!)
  • Asked our friend Google for solution and came across various blog posts to resolve but no joy!
  • Finally I decided to scrap what I had installed and make a fresh start. My colleague D who was helping me agreed and we configured the setup same as on his machine.

We had success – the list of Gulp Tasks was nicely visible in the Task Runner Explorer window!

Gulp Task Runner Sitecore Habitat II

By the way don’t feel that there wasn’t a ReadMe.md for the project setup, there was but still didn’t help.

On a side note, if you don’t know what is Gulp, this should help and here is how you get started on it.

The solution set, I was eager to run the gulp tasks to deploy the assets and the code to my local Sitecore setup. And as one would go, selected the default task -> right click -> Run. To my dismay we encountered another issue !!!!!

SyntaxError: Unexpected token )

Gulp Task Runner Sitecore Habitat III

Colleague S from the team came to rescue when I and colleague D had given up for the afternoon after investing so much time to resolve this. His investigation approach was similar, checking the same things that we did earlier, but with a slight twist.

  • We went on the Node command prompt and tried to execute commands from there. Still found that the same error was being encountered
  • We re-installed Node.js v6.10.0 LTS for Windows (x64)
  • Made sure that the environment variables and/or any other settings are not the cause of this issue – but still no joy!

Finally colleague S had an epiphany!

He goes let’s check what Node version is Visual Studio set to use. Well for those who don’t know Visual Studio ships with node.js Tools for Visual Studio (NTVS) which runs inside Visual Studio.

In VS2015’s Menu – Tools -> Options -> Projects and Solutions -> External Web Tools one would find .\node_modules\.bin as default settings

Gulp Task Runner Sitecore Habitat IV.png

We added a new location; the location where I had install the latest version of Node.js and moved it to the top of the order as shown below.

Gulp Task Runner Sitecore Habitat V.png

Saved it ran the “default“task from the list of Gulp tasks and Voilà!

The code and the assets got published and I was able to browse our Sitecore solution locally on my development machine. Thanks to my colleague S and D for helping me out.

Even though this is a little setting and but it is a gotcha which caused a blocker for a few hours. Hope this post comes as a solution to my fellow Sitecorians who are embarking on the Sitecore Habitat journey!

Happy Sitecoring !

Advertisements