Gulpfile.js not loaded in Visual Studio Task Runner Explorer

[omidkrad]

In MVC 6 boilerplate, VS 2015, Task Runner Explorer (Ctrl+Alt+Bkspace) cannot load the Gulpfile.js

It shows the following error: Failed to load. See output window for more info.

The Output window shows the following:

Failed to run "P:\Dev\src\TestProject\src\TestProject.Web\Gulpfile.js"...
cmd.exe /c gulp --tasks-simple
Error: The `libsass` binding was not found in P:\Dev\src\TestProject\src\TestProject.Web\node_modules\gulp-sass\node_modules\node-sass\vendor\win32-ia32-11\binding.node
This usually happens because your node version has changed.
Run `npm rebuild node-sass` to build the binding for your current node version.
    at Object.sass.getBinaryPath (P:\Dev\src\TestProject\src\TestProject.Web\node_modules\gulp-sass\node_modules\node-sass\lib\extensions.js:150:11)
    at Object.<anonymous> (P:\Dev\src\TestProject\src\TestProject.Web\node_modules\gulp-sass\node_modules\node-sass\lib\index.js:16:36)
    at Module._compile (module.js:456:26)
    at Object.Module._extensions..js (module.js:474:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:312:12)
    at Module.require (module.js:364:17)
    at require (module.js:380:17)
    at Object.<anonymous> (P:\Dev\src\TestProject\src\TestProject.Web\node_modules\gulp-sass\index.js:163:21)
    at Module._compile (module.js:456:26)
    at Object.Module._extensions..js (module.js:474:10)

Regardless of this error in VS, the gulp build command in the console completes successfully.

[omidkrad]

On a side note, to avoid a growing Gulpfile, I would suggest breaking it into different task files under a directory like build/tasks. Then in Gulpfile.js, you can load all the tasks like this:

require('require-dir')('build/tasks');

See this for an example.

[omidkrad]

One more thing: I noticed few of the boilerplate files have mixed tabs and spaces. Productivity Power Tools can find these and fix for you quickly. Also some files in the boilerplate have UTF-8 encoding without signature. I think the recommended way is to always save UTF-8 files with BOM signature. Thanks.

[RehanSaeed]

I have noticed problems with the Gulpfile.js sometimes too. I think this is a VS tooling issue. Closing and reopening the solution usually fixes the problem. Once or twice I have had to clear my NPM cache using the npm cache clear command. I will add a note about this to the ReadMe.html file. We need to keep an eye out for this issue.

Agreed, the gulfile.js is getting a bit long. However, I think it might make more sense to move the config settings out into a separate .json file instead. All the file paths etc in one place. I have seen an example of this but can't remember where. The tasks on their own are only 200 lines long,

Noted the issue with tabs vs spaces. Not sure how this occurred, my VS is set to spaces only, maybe I copied and pasted something somewhere. Would be good to know which files are affected.

UTF-8 without BOM is on purpose for a couple of files (JSCS requires it for example). I have since contacted the owners of these projects and they have now added BOM support so this should go away with the new versions of the Gulp tasks. Would be good to know which files are affected.

As to whether a BOM is a requirement, I have read somewhere that a BOM is not compliant with the official spec for UTF-8 but Microsoft adds it, which is why Linux/Mac devs don't include it and break things for us. Who knows.

[omidkrad]

I think Atom adds BOM by default and don't know if there is an option to disable it. I specifically noticed no BOM in the xproj file from the boilerplate. xproj in the original VS template has BOM.

To find out which files are affected, I use a script like Get-FileEncoding to detect file encodings, however for UTF-8 with no signature it detects them as ASCII. But still can convert them and see in the diff if a BOM was added during conversion:

> Get-ChildItem testfile*.txt |
select FullName, @{n='Encoding';e={Get-FileEncoding $_.FullName}} |
where { $_.Encoding -eq "ASCII" } |
foreach {
    $content = Get-Content $_.FullName;
    start-sleep -Milliseconds 100 # wait a little for the read handle to be released
    $content | Out-File $_.FullName -Encoding utf8
}

[RehanSaeed]

I've just checked the .xproj in NotePad2 and it's UTF8 With BOM. I may have changed the file since the last release though.

[omidkrad]

OK, back to Gulpfile and Task Runner Explorer problem, npm cache clear didn't fix it for me. Let's keep this issue open to track this.

[RehanSaeed]

Did you try restarting VS and delete the npm_modules folder too? I've seen that fix the problem for me sometimes. the Task Runner Explorer does not like errors in the gulpfile. You can also view the Output window to see if you are getting any errors.

[omidkrad]

Thanks, that fixed it. Though, clearing npm modules/cache and restoring them is a pain.

[RehanSaeed]

Agreed, I think this is a VS bug. Hopefully will be fixed in later Beta updates.