首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

有没有办法同时运行"tsc -watch“和"npm start”,只需在VSCode上点击一个按钮/快捷方式?

是的,可以通过使用VSCode的任务运行器来实现同时运行"tsc -watch"和"npm start"的功能,并通过点击一个按钮或快捷方式来触发。

首先,打开VSCode并进入你的项目文件夹。然后,按下Ctrl+Shift+B(或者点击顶部菜单栏中的"终端" -> "运行生成任务")来打开任务运行器。

在任务运行器中,你可以创建一个自定义任务来同时运行"tsc -watch"和"npm start"。点击"任务" -> "配置任务" -> "任务运行器",选择"终端"。

在打开的tasks.json文件中,你可以添加以下配置:

代码语言:txt
复制
{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "tsc -watch",
      "type": "shell",
      "command": "tsc -w",
      "group": {
        "kind": "build",
        "isDefault": true
      }
    },
    {
      "label": "npm start",
      "type": "shell",
      "command": "npm start",
      "group": {
        "kind": "build",
        "isDefault": true
      }
    }
  ]
}

保存并关闭tasks.json文件。

现在,你可以在VSCode的任务运行器中看到你刚刚创建的两个任务:"tsc -watch"和"npm start"。你可以通过点击任务运行器的播放按钮来同时运行这两个任务。

如果你想要将这个功能绑定到一个按钮或快捷方式上,可以通过自定义键盘快捷方式来实现。点击"文件" -> "首选项" -> "键盘快捷方式",在打开的keybindings.json文件中添加以下配置:

代码语言:txt
复制
{
  "key": "ctrl+shift+r",
  "command": "workbench.action.tasks.runTask",
  "args": "tsc -watch"
},
{
  "key": "ctrl+shift+s",
  "command": "workbench.action.tasks.runTask",
  "args": "npm start"
}

保存并关闭keybindings.json文件。

现在,你可以通过按下Ctrl+Shift+R来运行"tsc -watch"任务,通过按下Ctrl+Shift+S来运行"npm start"任务。这样,你就可以通过点击一个按钮或快捷方式来同时运行这两个任务了。

希望以上信息对你有所帮助!如果你有任何其他问题,请随时提问。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

  • Electron实践笔记

    社交魔方平台是京东的 SNS 活动搭建平台,其内置了很多模板,每一个模板都有一个模板 JSON 用于生成表单,运营同学、商家配置了这个表单后就可以生成活动页面了。模板 JSON 是标准的结构化数据,包含名称、类型、控件类型、校验器、默认值等等字段。以往都是采用手写 JSON 的方式,这是非常低效的,而且容易出错。针对其结构化数据的特点可以用 GUI 的方式去编辑,我们基于 Electron[1] 参考 Github Desktop 客户端[2] 的架构编写了一个 JSON 编辑器(参见下图),通过填写表单的方式生成 JSON。所以在这里记录下这个 Electron 编辑器开发过程中可以记录的点和从 Github Desktop 客户端代码中值得学习的点。

    01

    Electron实践笔记

    社交魔方平台是京东的 SNS 活动搭建平台,其内置了很多模板,每一个模板都有一个模板 JSON 用于生成表单,运营同学、商家配置了这个表单后就可以生成活动页面了。模板 JSON 是标准的结构化数据,包含名称、类型、控件类型、校验器、默认值等等字段。以往都是采用手写 JSON 的方式,这是非常低效的,而且容易出错。针对其结构化数据的特点可以用 GUI 的方式去编辑,我们基于 Electron[1] 参考 Github Desktop 客户端[2] 的架构编写了一个 JSON 编辑器(参见下图),通过填写表单的方式生成 JSON。所以在这里记录下这个 Electron 编辑器开发过程中可以记录的点和从 Github Desktop 客户端代码中值得学习的点。

    03

    TypeScript快速入门

    TypeScript是微软开源的一门面向对象的编程语言,是JavaScript的一个超集,因此对于已经存在的JavaScript程序,不需要任何改动就可以在TypeScript环境下运行。同时,TypeScript扩展了JavaScript的语法糖,添加了一些新的遵循ES6规范的语法,使得TypeScript具有了可选的静态类型和面向对象编程的特性。 作为一门全新的编程语言,TypeScript的诞生有它特殊的场景。Ajax的火热和JavaScript的复兴标志着前端一个全新时代的到来,这一时期的JavaScript代码正在变得越来越庞大,构建规模化JavaScript应用程序的需求日益旺盛。同时,微软工程师们发现,内部的研发部门以及外部的客户都表示JavaScript在大型Web应用中很容易出现失控,变得难以驾驭。 微软认为JavaScript只是一门脚本语言,设计理念简单,缺乏对类与模块的支持,并不能真正用于开发大型Web应用。基于此,微软内部开始出现需要自定义工具去强化JavaScript开发的需求。正是在这种情况下,微软的首席架构师安德斯·海尔斯伯格主持开发了TypeScript,并亲自进行推广。 自2012年10月份首个公开版本发布以来,迄今为止,TypeScript已发布了多个版本,并且越来越多的前端项目开始使用TypeScript来进行开发。和传统的JavaScript语言相比,TypeScript具有如下一些特点。

    01
    领券