什么是在Visual Studio 2017中设置gulp的正确方法?
我正努力在Visual Studio 2017中build立一个大嘴巴。我不确定我要去哪里错了,但有一些事情我很困惑,我真的找不到任何在线资源任何使用。
我正在使用的构build系统是CruiseControl.NET,我希望能够使用它。
这是我迄今为止所做的:
-
安装了Visual Studio 2017,并select了
.NET Core cross-platform development
和Node.js development
(以及其他选项)。 -
创build了一个新项目
-
在项目中添加了一个
gulpfile.js
文件 -
用鼠标右键单击该文件,然后select
Task Runner Explorer
在任务运行资源pipe理器中,我得到错误Failed to load. See output window (Ctl+Alt+O) for more information.
Failed to load. See output window (Ctl+Alt+O) for more information.
。
然后,如果我做了以下几点:
-
打开Node.js交互式窗口
-
运行命令
.npm install --global gulp-cli
-
closuresVisual Studio并再次打开它
在任务运行资源pipe理器,我然后得到消息(No tasks found)
。
首先,这是在Visual Studio 2017中设置Gulp的正确方法吗?
我问这个的原因是因为我不知道为什么我需要用句点字符(即.npm
而不是npm
)加前缀命令。
我也不确定在哪里安装了gulp,因为我在pathC:\Program Files (x86)\Microsoft Visual Studio\2017\Professional\Web\External\node_modules
。
因此,我不能真正build立CruiseControl.NET。
我处理这个问题的方式是首先使用Web Essentials 2017扩展。 这将安装Bundler&Minifier工具,然后将bundleconfig.json文件添加到您的项目中。 右键点击这个文件,进入Bundler&Minifier菜单项,你会在那里看到一个选项来转换为Gulp 。
selectconvert to gulp将创build必要的gulpfile.js ,并安装使用Gulp所需的npm包。 等待所有的npm包安装,然后你可以右键单击gulpfile.js ,selectTask Runner Explorer ,你应该准备好设置基于Gulp的任务。 如果您看到gulpfile.js加载消息失败 ,npm包仍可能正在安装(检查VS 2017状态栏上的进度条)。 安装完所有软件包后,点击Task Runner Explorer中的“ 刷新”图标,该错误应该消失。
可能还有一种更加手动的方式来添加Gulp支持,但是我发现这种更自动化的方法可以确保所有的工具都能正常工作,而且我不会错过任何东西。
我从令人敬畏的Microsoft Docs网站收集所有这些信息,特别是捆绑和缩小的这个页面。 在那里还有一个使用Gulp部分,可以为您的情况提供额外的细节。
https://docs.microsoft.com/en-us/aspnet/core/client-side/bundling-and-minification
微软现在已经添加了有关如何运行gulp的文档: https : //docs.microsoft.com/en-us/aspnet/core/client-side/less-sass-fa#getting-started
确保您将Visual Studio 2017更新为最新版本,因为它随附了Node.js,NPM和Gulp。
在您的项目文件夹中创build一个npmconfiguration文件(package.json)并编辑它以引用gulp:
{ "version": "1.0.0", "name": "asp.net", "private": true, "devDependencies": { "gulp": "3.9.1" } }
从开发机器上的命令行运行命令npm install
,并将此命令添加到构build服务器上的构build脚本。
如果您打算使用bower,那么运行命令bower init
。
在项目文件夹中,创build一个Gulpconfiguration文件(gulpfile.js)来定义自动化过程。
将命令gulp
添加到构build服务器上的构build脚本。 如果要指定要运行的path或任务,命令将类似于cmd.exe /c gulp -b "C:\Documentation\Wiki" --color --gulpfile "C:\Documentation\Wiki\Gulpfile.js" site.css
。 您可以通过右键单击任务并select“运行”来获得Visual Studio使用的完整命令,然后Task Runner Explorer将输出它运行的命令。
要在Visual Studio 2017中运行任务,请打开Task Runner Explorer(“视图”>“其他Windows”>“任务运行器资源pipe理器”)。