83

我已经看到可以在 VSCode 中定义任务。但我不确定如何在tasks.json文件中定义多个任务。

4

13 回答 13

36

以防万一它可以帮助某人...... 如果您没有/想要 gulp/grunt/etc... 或额外的 shell 脚本来代理您的任务命令，“npm run”已经存在。

这适用于 webpack 和 mocha，如“构建和测试” 、Shift++ 、Ctrl++BShiftCtrlT

.vscode/tasks.json：

{
  "name": "npmTask",
  //...
  "suppressTaskName": true,
  "command": "npm",
  "isShellCommand": true,
  "args": [
    "run"
  ],
  "tasks": [
    {
      //Build Task
      "taskName": "webpack",
      //Run On Shift+Ctrl+B
      "isBuildCommand": true,
      //Don't run when Shift+Ctrl+T
      "isTestCommand": false,
      // Show the output window if error any
      "showOutput": "silent",
      //Npm Task Name
      "args": [
        "webpack"
      ],
      // use 2 regex:
      // 1st the file, then the problem       
      "problemMatcher": {
        "owner": "webpack",
        "severity": "error",
        "fileLocation": "relative",
        "pattern": [
          {
            "regexp": "ERROR in (.*)",
            "file": 1
          },
          {
            "regexp": "\\((\\d+),(\\d+)\\):(.*)",
            "line": 1,
            "column": 2,
            "message": 3
          }
        ]
      }
    },
    {
      //Test Task   
      "taskName": "mocha",
      // Don't run on Shift+Ctrl+B
      "isBuildCommand": false,
      // Run on Shift+Ctrl+T
      "isTestCommand": true,
      "showOutput": "always",
      "args": [
        "mocha"
      ]
    }
  ]
}

包.json：

{
  ...
  "scripts": {
    "webpack": "webpack",
    "mocha": "/usr/bin/mocha"
  },
  ...
}
于 2015-09-20T13:55:14.450 回答
13

帮助我更好地理解这一点的是传递给命令的参数序列。这对某些人来说可能很明显，但在文档中并不清楚。

省略一些字段以仅关注正在发送的命令：

{ "command": "myCommand"
  "args": ["myCommandArguments"],
  "tasks" : [ 
    { "taskName": "myTask",
      "args": ["myTaskArguments"],
      "suppressTaskName": false,
    }
  ]
}

上面的定义将导致以下命令：

myCommand myCommandArguments myTaskArguments myTask

任务名称myTask始终位于最后。从 0.4 版开始，它可以用"suppressTaskName": true.

于 2015-05-24T01:36:11.200 回答
13

尝试这个

{
    "version": "0.1.0",
    "command": "cmd",
    "isShellCommand": true,
    "args": ["/C"],
    "tasks": [
        {
            "taskName": "install",
            "args": ["npm install"]
        },
        {
            "taskName": "build",
            "args": ["gulp build"],
            "isBuildCommand": true,
            "problemMatcher": "$gulp-tsc"
        }
    ]
}
于 2015-08-19T17:06:00.480 回答
10

我使用以下 tasks.json 文件来运行多个 TypeScript 构建方案。我在每个文件夹中放置了一个 tsconfig.json 文件，这样我就可以单独调整每个文件夹的输出。只需确保您禁止显示任务名称，因为它会尝试将其放入命令字符串中。

{
    "version": "0.1.0",
    "command": "tsc",
    "showOutput": "always",
    "isShellCommand": true,
    "args": [],
    "windows": {
        "command": "tsc",
        "showOutput": "always",
        "isShellCommand": true
    },
    "tasks": [
        {
            "taskName": "Build the examples",
            "suppressTaskName": true,
            "isBuildCommand": false,            
            "args": ["-p", "./source/examples", "--outDir", "./script/examples"],
            "problemMatcher": "$tsc"
        },
        {
            "taskName": "Build the solution",            
            "suppressTaskName": true,
            "isBuildCommand": false,        
            "args": ["-p", "./source/solution", "--outDir", "./script/solution"],
            "problemMatcher": "$tsc"
        }   
    ]
}

这是文件夹结构的样子，其中 /script 是输出根目录，/source 是输入根目录。两个文件夹都引用 /typingd 文件夹和 /typings 文件夹中的类型声明。TypeScript 在某种程度上仅限于在外部引用中使用相对路径，因此如果这些文件夹结构相似，它有助于简化事情。

TypeScript 多构建文件夹结构

哦，是的，如果您将它们标记为非构建并覆盖构建键以从列表中选择特定任务，则可以更轻松地有选择地启动它们，就像这样..

// Place your key bindings in this file to overwrite the defaults
[
    { "key": "ctrl+shift+b", "command": "workbench.action.tasks.runTask" }
]

更新：如果你愿意，你总是可以完全无赖。可能有更好的方法来处理参数，但目前这对我在 OSX 下有效。

{
  "version": "0.1.0",
  "isShellCommand": true,
  "linux": { "command": "sh", "args": ["-c"] },
  "osx": { "command": "sh", "args": ["-c"] },
  "windows": { "command": "powershell", "args": ["-Command"] },
  "tasks": [
    {
      "taskName": "build-models",
      "args": ["gulp build-models"],
      "suppressTaskName": true,
      "isBuildCommand": false,
      "isTestCommand": false
    },
    {
      "taskName": "run tests",
      "args": ["mocha ${workspaceRoot}/test"],
      "suppressTaskName": true,
      "isBuildCommand": false,
      "isTestCommand": false
    }
  ]
}
于 2015-09-29T09:03:59.897 回答
7

我不知道对此的正确答案（并且也想知道），但是我的丑陋解决方法以防万一它对任何人有所帮助。我在 Windows 上，我最终为自己创建了一个简单的批处理脚本，它可以包含简单

"%1" "%2"

然后我的 tasks.json 看起来像

{
    "version": "0.1.0",
    "command": "c:\\...\\mytasks.bat"
    "tasks" : [
        {
            "taskName": "myFirstTask",
            "args": "c:\\...\\task1.exe", "${file}"],
        },
        {
            "taskName": "mySecondTask",
            "args": "c:\\...\\task2.exe", "${file}"],
        },
    ]
}
于 2015-05-05T15:12:33.263 回答
6

您可以在任务属性中列出多个任务。就像是：

"tasks": [
    {
        "taskName": "build",
        ...
    },
    {
         "taskName": "package",
         ...
    }
]
于 2015-05-05T15:12:24.523 回答
4

此功能是在Visual Studio Code v1.9（2017 年 1 月）中添加的。示例和文本来自发行说明：

{
  "version": "0.1.0",
  "tasks": [
    {
      "taskName": "tsc",
      "command": "tsc",
      "args": ["-w"],
      "isShellCommand": true,
      "isBackground": true,
      "problemMatcher": "$tsc-watch"
    },
    {
      "taskName": "build",
      "command": "gulp",
      "args": ["build"],
      "isShellCommand": true
    }
  ]
}

每个任务的命令

您现在可以为每个任务定义不同的命令 ( #981 )。这允许为不同的任务运行不同的命令，而无需编写自己的 shell 脚本。每个任务使用命令的tasks.json文件看起来像 [the above.]

于 2017-04-23T02:14:27.467 回答
3

这似乎是 v0.5.0 的 VSCode 错误

所以我添加了这个答案来展示@hurelu之前解释的一个工作示例。我的任务.json：

{
    "version": "0.1.0",
    "command": "gulp",
    "isShellCommand": true,
    "args": [
        "--no-color"
    ],
    "tasks": [
        {
            "taskName": "--verbose",
            "isBuildCommand": true,
            "showOutput": "always",
            "args": [
                "vet"
            ],
            "problemMatcher": [
                "$jshint",
                "$jshint-stylish"
            ]
        },
        {
            "taskName": "vet",
            "isTestCommand": true,
            "showOutput": "always",
            "args": [],
            "problemMatcher": [
                "$jshint",
                "$jshint-stylish"
            ]
        }
    ]
}

我的 gulp.js：

/// <reference path="typings/tsd.d.ts" />

var gulp = require('gulp');
var jshint = require('gulp-jshint');
var jscs = require('gulp-jscs');
var util = require('gulp-util');
var gulpprint = require('gulp-print');
var gulpif = require('gulp-if');
var args = require('yargs').argv;

gulp.task('vet', function () {
    log('Analyzing source with JSHint and JSCS');

    return gulp
        .src
        ([
            './src/**/*.js',
            './*.js'
        ])
        .pipe(gulpif(args.verbose, gulpprint()))
        .pipe(jscs())
        .pipe(jshint())
        .pipe(jshint.reporter('jshint-stylish', { verbose: true }))
        .pipe(jshint.reporter('fail'));
});

gulp.task('hello-world', function () {
    console.log('This is our first Gulp task!');
});

////////////
function log(msg) {
    if (typeof (msg) === 'object') {
        for (var item in msg) {
            if (msg.hasOwnProperty(item)) {
                util.log(util.colors.blue(msg[item]));
            }
        }
    } else {
        util.log(util.colors.blue(msg));
    }

}

注意第一个任务使用 isBuildCommand 所以 CTRL+SHFT+B 启动，下一个任务是 isTestCommand 所以 CTRL+SHFT+T 启动。但是，为了让第一个任务接受 args，任务名称和 args 必须颠倒过来。

从 VSCode 0.5.0 开始，上述方法有效，但以下方法无效：

{
    "version": "0.1.0",
    "command": "gulp",
    "isShellCommand": true,
    "args": [
        "--no-color"
    ],
    "tasks": [
        {
            "taskName": "vet",
            "isBuildCommand": true,
            "showOutput": "always",
            "args": [
                "--verbose"
            ],
            "problemMatcher": [
                "$jshint",
                "$jshint-stylish"
            ]
        },
        {
            "taskName": "vet",
            "isTestCommand": true,
            "showOutput": "always",
            "args": [],
            "problemMatcher": [
                "$jshint",
                "$jshint-stylish"
            ]
        }
    ]
}

这是 task.json 的输出，具有正确的任务和参数顺序：

[10:59:29] Using gulpfile ~/Workspaces/Examples/Gulp/pluralsight-gulp/gulpfile.js
[10:59:29] Task 'default' is not in your gulpfile
[10:59:29] Please check the documentation for proper gulpfile formatting

这是 tasks.json 的正确输出，使用 args 时任务名和 arg 颠倒了：

[11:02:44] Using gulpfile ~/Workspaces/Examples/Gulp/pluralsight-gulp/gulpfile.js
[11:02:44] Starting 'vet'...
[11:02:44] Analyzing source with JSHint and JSCS
[gulp] src/server/app.js
[gulp] src/client/app/app.module.js
[gulp] src/client/test-helpers/bind-polyfill.js
[gulp] src/client/test-helpers/mock-data.js
[gulp] src/server/routes/index.js
[gulp] src/client/app/core/config.js
[gulp] src/client/app/core/constants.js
[gulp] src/client/app/core/core.module.js
[gulp] src/client/app/core/dataservice.js
[gulp] src/client/app/core/dataservice.spec.js
[gulp] src/client/app/customers/customer-detail.controller.js
[gulp] src/client/app/customers/customer-detail.controller.spec.js
[gulp] src/client/app/customers/customers.controller.js
[gulp] src/client/app/customers/customers.controller.spec.js
[gulp] src/client/app/customers/customers.module.js
[gulp] src/client/app/customers/customers.route.js
[gulp] src/client/app/customers/customers.route.spec.js
[gulp] src/client/app/dashboard/dashboard.controller.js
[gulp] src/client/app/dashboard/dashboard.controller.spec.js
[gulp] src/client/app/dashboard/dashboard.module.js
[gulp] src/client/app/dashboard/dashboard.route.js
[gulp] src/client/app/dashboard/dashboard.route.spec.js
[gulp] src/client/app/layout/ht-sidebar.directive.js
[gulp] src/client/app/layout/ht-sidebar.directive.spec.js
[gulp] src/client/app/layout/ht-top-nav.directive.js
[gulp] src/client/app/layout/layout.module.js
[gulp] src/client/app/layout/shell.controller.js
[gulp] src/client/app/layout/shell.controller.spec.js
[gulp] src/client/app/layout/sidebar.controller.js
[gulp] src/client/app/layout/sidebar.controller.spec.js
[gulp] src/client/app/widgets/ht-img-person.directive.js
[gulp] src/client/app/widgets/ht-widget-header.directive.js
[gulp] src/client/app/widgets/widgets.module.js
[gulp] src/client/tests/server-integration/dataservice.spec.js
[gulp] src/server/routes/utils/errorHandler.js
[gulp] src/server/routes/utils/jsonfileservice.js
[gulp] src/client/app/blocks/exception/exception-handler.provider.js
[gulp] src/client/app/blocks/exception/exception-handler.provider.spec.js
[gulp] src/client/app/blocks/exception/exception.js
[gulp] src/client/app/blocks/exception/exception.module.js
[gulp] src/client/app/blocks/logger/logger.js
[gulp] src/client/app/blocks/logger/logger.module.js
[gulp] src/client/app/blocks/router/router-helper.provider.js
[gulp] src/client/app/blocks/router/router.module.js
[gulp] gulpfile.js
[gulp] karma.conf.js
[11:02:48] Finished 'vet' after 4.37 s
于 2015-07-21T15:51:22.273 回答
2

从2017 年 2 月的版本开始，您可以使用 Terminal Runner 并通过设置依赖任务来组合多个任务。这有点奇怪，因为它会为每个任务打开一个单独的集成终端，你必须观察它以查看事情是否正常并记住关闭（它们“堆叠”），并且你不会收到“完成”通知，但它完成了工作。该功能是初步的，但很有希望。这是一个为 Cordova 应用程序运行 tsc 和 jspm 的示例。

{
// See https://go.microsoft.com/fwlink/?LinkId=733558
// for the documentation about the tasks.json format
"version": "2.0.0",
"tasks": [{
        "taskName": "tsc",
        "command": "tsc",
        "isShellCommand": true,
        "args": ["-p", "."],
        "showOutput": "always",
        "problemMatcher": "$tsc"
    }, {
        "taskName": "jspm",
        "command": "jspm",
        "isShellCommand": true,
        "args": ["bundle-sfx", "www/app/main.js", "www/dist/bundle.js", "--inline-source-maps", "--source-map-contents"],
        "showOutput": "always"
    },
    {
        "taskName": "build",
        "isBuildCommand": true,
        "dependsOn": ["tsc", "jspm"]
    }]
}
于 2017-03-04T15:20:18.013 回答
1

以下对我有用：

任务.json：

{
    "version": "0.1.0",
    "command": "cmd",
    "isShellCommand": true,
    "args": [
        "/c"
    ],
    "tasks": [
        {
            "taskName": "bower",
            "args" : ["gulp bower"],
            "isBuildCommand": true,
            "showOutput": "always"
        },
        {
            "taskName": "unittest",
            "suppressTaskName": true,
            "args" : ["dnx -p ${cwd}\\test\\MyProject.UnitTests test"],
            "isTestCommand": true,
            "showOutput": "always"
        }
    ]
}

MyProject.UnitTests\project.json：

 "commands": {
    "test": "xunit.runner.dnx"
  }

运行凉亭：来自 vscode 的 Ctrl + Shift + B 运行测试：来自 vscode 的 Ctrl + Shift + T

于 2015-10-16T14:23:58.390 回答
1

我有一个 Electron 应用程序，需要编译更少的样式表，然后构建并启动程序。我使用了对我有用的@Ocean 的解决方案……没有其他方法。

我的 tasks.json 和 build-tasks.bat 文件都位于项目根目录的 .vscode 目录中。

构建任务.bat

@ECHO OFF
@ECHO Begin!
@ECHO Compiling Less

call lessc ./css/styles.less ./css/styles.css

@ECHO Build Electron App and Launch

call electron ./app.js

@ECHO Finished!

任务.json

{
    "version": "0.1.0",
    "command": "${workspaceRoot}\\.vscode\\build-tasks.bat",
    "isShellCommand": true,
    "isWatching": true,
    "showOutput": "always",

    "args": [],

    "tasks": [
        {
            "taskName": "build",
            "isBuildCommand": true,
            "isWatching": true,
            "showOutput": "always"
        }
    ]
}
于 2016-09-15T19:51:44.933 回答
1

这对我有用...

我知道这里有很多不同的答案，但我的方法又有点不同，所以我想我会加上我的 2 便士价值。

我在 Windows 上并使用外部批处理文件来运行我的命令。它类似于上面乔纳森的回答，但我没有向它发送任何命令，这意味着我的“tasks.json”文件不同。

随着时间的推移，我可能会改变这种方法（例如，我还没有开始使用 gulp），但目前这种方法对我来说非常有效。

我正在使用把手用于 html 模板、babel，因此我可以使用 ES6 代码和代码 linter 来发现错误。最后，批处理文件使用我的起始页 (index.html) 启动浏览器

这是我名为 run_tasks.bat 的批处理文件：

@ECHO OFF
@ECHO Startz!
@ECHO Running Handlebars!

call handlebars html_templates -e html -f dist/html_templates.js

@ECHO Linting ES6 code

call eslint -c eslint.json src

@ECHO Running Babel ES6 to ES5

call babel src --out-dir dist --source-maps

@ECHO Now startzing page up in browser!
index.html

@ECHO Donezz it!

这是我的 tasks.json 文件：

{ 
    "version": "0.1.0",
    "command": "${workspaceRoot}/run_tasks.bat",
    "isShellCommand": true,
    "isWatching": true,
    "showOutput": "always",

    "args": [],

    "tasks": [
        {
            "taskName": "build",
            "isBuildCommand": true,
            "isWatching": true,
            "showOutput": "always"
        }
}

然后，在 VSCode 中，我按“CTRL + SHIFT + B”来运行我的批处理文件。

于 2015-11-26T08:12:07.810 回答
0

感谢这个线程，我现在可以在 osx 上的 vscode 中使用 c#/dnxcore50 构建和测试调试等：

{
"version": "0.1.0",
"command": "bash",
"args": [
],
"tasks": [
    {
        "taskName": "xbuild",
        "args": [
            "./src/Service.Host/Service.Host.csproj"
        ],          

        "showOutput": "always",
        "problemMatcher": "$msCompile",
        "isBuildCommand": true
    },
    {
        "taskName": "dnx",
        "args" : ["-p", "./test/Service.Tests.Unit", "test"],
        "isTestCommand": true,
        "showOutput": "always"    
    }      
]
}

我相信linux基本上是一样的。唯一让我烦恼的是必须维护 .csproj 文件只是为了调试。我期待着一种使用 dnx 进行调试的方法，尽管我已经有几个星期没有寻找了。

于 2016-03-16T21:35:57.810 回答