VS Code and tasks with node

Question

Until now I used gulp for building typescript and sass files, but now due to a couple of new build steps I'd like to unify everything and use node as a single entry point (also node for running gulp tasks via npm run taskName).

tasks.json is quite simple, task build should run npm run watch:

{
    "version": "0.1.0",
    "command": "npm",
    "isShellCommand": true,
    "tasks": [
        {
            "taskName": "build",
            "isBuildCommand": true,
            "showOutput": "always",
            "isWatching": true,
            "args": [
                "run", "watch"
            ]
        }
    ]
}

package.json

"scripts": {
    "watch": "gulp default",
}

And the output:

gulp default build
[14:20:54] Using gulpfile PATH_TO/gulpfile.js
[14:20:54] Task 'build' is not in your gulpfile
[14:20:54] Please check the documentation for proper gulpfile formatting
npm ERR! Windows_NT 6.3.9600
npm ERR! argv "C:\\Program Files (x86)\\nodejs\\\\node.exe" "C:\\Program Files (x86)\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "watch" "build"
npm ERR! node v0.12.2
npm ERR! npm  v2.7.4
npm ERR! code ELIFECYCLE
npm ERR! 2@0.1.0 watch: `gulp default build`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the 2@0.1.0 watch script 'gulp default build'.
npm ERR! This is most likely a problem with the 2 package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR!     gulp default build
npm ERR! You can get their info via:
npm ERR!     npm owner ls 2
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:

Based on the output, gulp is still somehow used even thought there is no sign of it in tasks.json (gulpfile.json exists in root directory and while searching for a solution I found that VS Code auto detects it, which I assume might be the problem?). Also taskName property is looks like automatically appended to command line as an argument which is wrong.

A smaller but working example (but it still runs gulp therefore typescript is compiled twice on each save):

{
    "version": "0.1.0",
    "command": "npm",
    "isShellCommand": true,
    "args": [
        "run", "watch"
    ],
    "showOutput": "always"
}

How can I have multiple tasks with in VS Code through npm?

Answer 1

VS Code now has Task Auto detection for major systems like npm, gulp etc... so you may not have to define these tasks separately in your workspace anymore.

Answer 2

.vscode/tasks.json example using the latest v2.0.0 syntax:

{
  "version": "2.0.0",
  "tasks": [
    {
      "type": "npm",
      "script": "start",
    },
    {
      "type": "npm",
      "script": "test",
    },
    {
      "type": "npm",
      "script": "lint",
      "problemMatcher": [
        "$eslint-stylish"
      ],
    }
  ]
}

Answer 3

As mentioned in my comments, if you're looking to run npm scripts tasks from VS Code, look for this article that basically instructs to create a .vscode\tasks.json like the following:

{
    "version": "0.1.0",
    "command": "npm",
    "isShellCommand": true,
    "suppressTaskName": true,
    "tasks": [
        {
        // Build task, Ctrl+Shift+B
        // "npm install --loglevel info"
        "taskName": "install",
        "isBuildCommand": true,
        "args": ["install", "--loglevel", "info"]
        },
        {
        // Test task, Ctrl+Shift+T
        // "npm test"
        "taskName": "test",
        "isTestCommand": true,
        "args": ["test"]
        },
        {
        // "npm run lint"
        "taskName": "lint",
        "args": ["run", "lint"]
        }
    ]
}

As an alternative, there's also a sample VS Code extension from Microsoft specifically aimed at detecting and running npm scripts items: vscode-npm-scripts