VS 2019 gruntfile.js no tasks found when using 'sass = require('node-sass')'

Question

I'm trying to set up grunt-sass for the first time on a new .Net Core 3.1 web app. I've gone through MSFT's steps to add grunt to a project here outlined here and then modified it with the steps from the grunt-sass instructions here.

This however causes task runner explorer to state there are no tasks found. Here is my package.json:

{
  "name": "chapelstudios_www",
  "version": "0.0.2",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://me@bitbucket.org/me/chapelstudios_www.git"
  },
  "author": "mr",
  "license": "ISC",
  "homepage": "https://bitbucket.org/me/chapelstudios_www#readme",
  "private": true,
  "devDependencies": {
    "grunt": "^1.0.4",
    "grunt-cli": "^1.3.2",
    "grunt-sass": "^3.1.0",
    "node-sass": "^4.13.1"
  },
  "dependencies": {
    "gulp": "^4.0.2"
  }
}

And this is my gruntfile.js:

const sass = require('node-sass');
require('load-grunt-tasks')(grunt);

module.exports = function (grunt) {
    // Project configuration.
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),

        // Sass
        sass: {
            options: {
                implementation: sass,
                sourceMap: true, // Create source map
                outputStyle: 'compressed' // Minify output
            },
            dist: {
                files: [
                    {
                        expand: true, // Recursive
                        cwd: "Styles", // The startup directory
                        src: ["**/*.scss"], // Source files
                        dest: "wwwroot/css", // Destination
                        ext: ".css" // File extension
                    }
                ]
            }
        }
    });

    // Load the plugin
    grunt.loadNpmTasks('grunt-sass');

    // Default task(s).
    grunt.registerTask('default', ['sass']);
};

I'm not sure how to get any more detailed error info then that but have tracked down the issue to the

const sass = require('node-sass');

line that is required by the grunt-sass instructions. If I change it to the string 'sass' that is recommended by older tutorials the task shows but fails when I attempt to actually run it.

I've also ran the following installations from an elevated powershell window in the project directory in an attempt to make sure they were installed into the project locally as I hear that to be a main issue:

npm install
npm install grunt
npm install grunt-cli
npm install --save-dev node-sass grunt-sass

At this point I'm out of ideas but I'm a newb so I'm sure I'm missing something obvious.

I have a similar problem. I am using Visual studio for Mac and have installed Task Explorer. However I always get the error: Failed to load /Users/xxxx/Developer/Projects/xxx/xxx/Gruntfile.js ApplicationName='grunt', CommandLine='--no-color --tasks "/Users/xxxx/Library/Application Support/VisualStudio/8.0/LocalInstall/Addins/MonoDevelop.TaskRunnersBundle.0.1/GruntScript" md-grunt-task-list', CurrentDirectory='/Users/xxxx/Developer/Projects/xxx/xxx', Native error= Cannot find the specified file — HendrikKoelbel, Feb 27 '20 at 20:12

score 2 · Answer 1 · answered Feb 08 '21 at 04:24

Reviving an old topic but here is what worked for me. YMMV.

In Visual Studio, go to: Tools -> Options -> Web Package Management -> External Web Tools.
Move $(PATH) above $(VSInstalledExternalTools).

I have no idea if there are any side effects to doing this.

credit to: https://developercommunity.visualstudio.com/solutions/314606/view.html

score 1 · Answer 2 · answered May 05 '20 at 00:23

For anyone else visiting this with an existing project, I was having this issue with a pre-existing node-sass / grunt file on a new computer, and I found that bumping up the version of node-sass in my package.json caused VS to reinstall the packages and update the bindings as noted in the other answer.

I have a slight suspicion that there's a difference in versions between running grunt in my command prompt and whatever VS uses, since my grunt file worked just fine if I ran it manually, but would not show up in Task Runner Explorer.

thanks - your comment led me to run `npm install`, which fixed things! — danwag, Feb 07 '23 at 16:48

score 0 · Answer 3 · answered Feb 04 '20 at 05:42

I found the following error which led me to do a rebuild:

Error: Missing binding A:\Projects\Repos\chapelstudios_www\node_modules\node-sass\vendor\win32-x64-79\binding.node
Node Sass could not find a binding for your current environment: Windows 64-bit with Node.js 13.x

Found bindings for the following environments:
  - Windows 64-bit with Node.js 10.x

This usually happens because your environment has changed since running `npm install`.
Run `npm rebuild node-sass` to download the binding for your current environment.

score 0 · Answer 4 · answered Sep 24 '20 at 18:31

As Jake mentioned I tracked the error down to this line as well:

const sass = require('node-sass');

Running rebuild didn't work. I found that after upgrading node from version 10.x to current version (12.18 Windows) and then rebuilding fixed the issue.

npm rebuild node-sass

VS 2019 gruntfile.js no tasks found when using 'sass = require('node-sass')'

4 Answers4