如何设置gulp以在Visual Studio 2017和msbuild中以相同的方式运行而无需更改我的构建脚本?

时间:2017-04-03 15:32:21

标签: node.js visual-studio gulp visual-studio-2017

我在Visual Studio 2017中苦苦挣扎。我不知道自己哪里出错了但是有些事情让我感到困惑和我无法找到任何有用的在线资源。

我使用的构建系统是CruiseControl.NET,我希望能够使用它。

这是我到目前为止所做的:

  • 安装了Visual Studio 2017,并选择了.NET Core cross-platform developmentNode.js development(以及其他选项)。

  • 创建了一个新项目

  • 在项目中添加了gulpfile.js个文件

  • 右键单击该文件,然后选择Task Runner Explorer

在Task Runner Explorer中,我收到错误Failed to load. See output window (Ctl+Alt+O) for more information.

然后,如果我执行以下操作:

  • 打开Node.js交互式窗口

  • 运行命令.npm install --global gulp-cli

  • 关闭Visual Studio并重新打开

在Task Runner Explorer中,我收到消息(No tasks found)

首先,这是在Visual Studio 2017中设置Gulp的正确方法吗?

我之所以这样问是因为我不确定为什么我需要为带有句点字符的命令加前缀(即.npm而不是npm)。

我也不确定gulp的安装位置,因为我无法在路径C:\Program Files (x86)\Microsoft Visual Studio\2017\Professional\Web\External\node_modules中找到它。

因此,我无法真正建立CruiseControl.NET。

3 个答案:

答案 0 :(得分:8)

我处理此问题的方法是首先使用 Web Essentials 2017 扩展程序。这将安装 Bundler& Minifier 工具,然后将 bundleconfig.json 文件添加到您的项目中。右键单击此文件,转到 Bundler& Minifier 菜单项,你会看到一个选项转换为Gulp

选择convert to gulp将创建必要的 gulpfile.js ,并安装使用Gulp所需的npm包。等待所有npm软件包安装,然后您可以右键单击 gulpfile.js ,选择 Task Runner Explorer ,您应该已准备好设置基于Gulp的任务。如果您看到 gulpfile.js无法加载消息,则可能仍在安装npm软件包(请检查VS 2017状态栏上的进度条)。安装完所有软件包后,点击Task Runner Explorer中的刷新图标,错误就会消失。

可能有一种更加手动的方式来添加Gulp支持,但我发现这种更自动化的方法可确保所有工具都能正常工作,我不会错过任何内容。

我从很棒的 Microsoft Docs 网站收集了所有这些信息,特别是在Bundling&缩小。此处还有使用Gulp 部分,可能会为您的情况提供更多详细信息。

https://docs.microsoft.com/en-us/aspnet/core/client-side/bundling-and-minification

答案 1 :(得分:6)

微软现在已经添加了有关如何运行gulp的文档: https://docs.microsoft.com/en-us/aspnet/core/client-side/using-gulp

确保将Visual Studio 2017更新到最新版本,因为它现在附带Node.js,NPM和Gulp(您不需要选择" Node.js支持&#34 ;安装Visual Studio以实现此目的时。)

在项目文件夹中创建一个npm配置文件(package.json)并编辑它以引用gulp:

{
  "version": "1.0.0",
  "name": "example",
  "private": true,
  "devDependencies": {
    "gulp": "3.9.1"
  },
  "scripts": {
    "gulp": "gulp"
  }
}

在项目文件夹中,创建Gulp配置文件(gulpfile.js)以定义自动化过程。

将以下内容添加到需要gulp支持的每个项目的构建后事件命令行:

cd $(ProjectDir)
call dotnet restore
npm run gulp

要在Visual Studio 2017中运行任务,请打开Task Runner Explorer(查看>其他Windows> Task Runner Explorer)。

然后在构建服务器上安装Node.js并确保将节点路径添加到环境路径变量中,然后当构建服务器构建项目时,gulp也将运行!

答案 2 :(得分:1)

我找到了解决方案here

您必须使用Node.js版本强制运行Visual Studio:

转到Tools> Visual Studio 2017中的Options

转到Projects and Solutions> External Web Tools

添加以下路径:C:\Program Files\nodejs

enter image description here