你试过使用VSCodeTasks吗？如果没有，您可以从本文中学习如何直接在VSCode中快速运行npm脚本，并使用快捷方式。我处理过的所有JavaScript项目都有一组定义的脚本，您可以为应用程序执行这些脚本。通常，这些脚本是帮助您测试、构建或部署代码的命令。与我合作过的大多数开发人员都从他们选择的命令行运行这些命令。要么你必须死记硬背你的项目脚本，要么你的命令行可能有一些提前输入的功能，要么你就像我一直做的那样，抓取历史记录来找到你过去运行的命令。history|grep'npmrun'相反，您可以使用“任务”为您运行脚本。您可以先打开命令面板Cmd+Shift+P，然后选择“任务：运行任务”。VSCode将为您提供它支持的许多任务类型。继续并选择“npm”。编辑器将快速扫描您的package.json并提供您定义的任务：选择一个脚本，您就完成了！一个新的内置终端窗口打开，您可以看到脚本的输出，并从您离开的地方继续工作。嗯，这看起来很酷。但您可能会想：“嘿，我的项目没那么简单，我的任务中有参数，不同的选项，也许我需要先打开子文件夹！”。当然，你也可以这样做！配置任务假设您要为特定测试文件运行单元测试，您的测试命令可能如下所示：npmtest'my-component.js'--auto-watch--no-single-run我通常的工作流程如下。我想在监视模式下运行正在进行的单元测试。通常，您需要在测试命令中插入文件名，但VSCode可以为您完成。为此，我们可以使用为我们提供的一些替代变量。例如：${fileBasename}。可以在此处的官方文档中找到可用变量的完整列表。现在，再次打开命令面板，选择“任务：运行任务”，然后选择“未配置任务。配置任务...”，然后选择要配置的任务。这将在项目中创建并打开一个新文件：.vscode/tasks.json。您可以将此文件添加到.gitignore或进行提交，因此您的团队也可以执行这些任务。添加替换变量后，配置应如下所示：{"version":"2.0.0","tasks":[{"type":"npm","script":"test${fileBasename}--autowatch--no-single-run","problemMatcher":[],"label":"npm:testopenedfile","detail":"npmtest"}]}然后，就像那样，您的自定义任务将是在命令面板中运行它可用。您的自定义任务现在位于您可以从命令面板运行的列表中。现在打开你要运行的测试文件，例如：my-component-test.js。运行Cmd+Shift+P->“Tasks:Runningtasks”，你应该会看到新配置的任务：“npm:testopenedfile”。选择它，它应该在终端中运行npmtestmy-component-test.js--auto-watch--no-single-run。您还可以自定义脚本结果的显示方式。我想为此类命令打开一个新终端。为此，您只需提供额外的“演示”配置。{..."presentation":{"panel":"dedicated",}}现在，您可以看到多个终端窗口打开，您可以在它们之间切换。配置Shell任务如果你想执行其他Shell命令，VSCode也支持。现在，我们可以使用shell，而不是使用npm类型。例如。{"version":"2.0.0","tasks":[{"label":"RunCypress","type":"shell","command":"cdtests/e2e/cypress/&&npmruncypress",}}总结基于以上示例，您可以在几分钟内配置您的自定义开发工作流程，并享受运行脚本和直接在编辑器中查看结果的完全集成体验。如果这有助于改善您的开发工作流程，或者您有任何疑问，请发表评论，谢谢！大家玩得开心！
