使用Visual Studio 2015检测gulp中的发布/调试

Question

我在Visual Studio中设置了一个ASP.NET 5项目并创建了一个gulpfile.js,我用它来构建我的打字稿和更少的文件.

对于发布版本,我想uglify和concat我的javascripts,并且为了调试我想在我的输出文件夹中包含我的typescript-和maps.

有没有办法'告诉'吞吐当前的配置？我已经看到了一些关于设置NODE_ENV环境变量的提及,但到目前为止我看到的解决方案并不是最优的.他们需要在启动IDE之前使用命令行等.

我见过的最接近的解决方案是:http://www.colinsalmcorner.com/post/gulp--workaround-for-handling-vs-solution-configuration

但是,这确实意味着我无法再使用IDE中内置的Task Runner Explorer

Answer 1

在Visual Studio 2015中,通过gulp集成,我喜欢@edo limburg和@RamenChef的最佳答案.

我在与web api相同的解决方案中有一个单页角应用程序.在构建SPA时,我只是想在HTML和几个JavaScript文件中将URL替换为API和OAuth2(OIDC)授权服务器.

我创建了一个包含Debug和Release任务的gulpfile.js.请注意区分大小写的拼写:

gulp.task('Debug', function () { 
 gulp.src("./callback.html")
    .pipe(replace(uatAuthority,
                    debugAuthority))
    .pipe(gulp.dest('./'));
...
}
gulp.task('Release', function () {
 gulp.src("./callback.html")
    .pipe(replace(debugAuthority,
                    uatAuthority))
    .pipe(gulp.dest('./'));
)
}

仅供参考,我使用了gulp-string-replace来处理替换任务:

var replace = require('gulp-string-replace');

在Task Runner Explorer中测试任务后,我卸载了项目文件并对其进行了编辑,在结束项目标记之前添加了以下代码:

<Target Name="BeforeBuild">
    <Exec Command="gulp $(Configuration)" />
  </Target>

Answer 2

我知道这种情况已经存在了一段时间，但是我最近遇到了同样的问题，并对在SO上的答案中发现的其他解决方案和变通方法不满意。我在aspnet github页面上的评论中找到了一个很好的解决方案：https : //github.com/aspnet/Home/issues/1231#issuecomment-182017985

我希望它可以帮助某人获得比我更快乐的解决方案。

只需将以下行添加到项目配置中的预构建事件中

echo {"config" : "$(ConfigurationName)"} > ../buildConfig.json

带着那小小的美，您可以在任务中阅读并做出相应的反应。在调试模式下，我用它来防止缩小文件，如下所示：

gulp.task("min:js:bundlesFolder", function ()
    {
        var json = fs.readFileSync("./buildConfig.json", "utf8");
        var host = JSON.parse(json.replace(/^\uFEFF/, ''));
        host.isDebug = host.config == "Debug";
        console.log(host.isDebug);
        if (host.isDebug === true)
        {
            return;
        }
        return gulp.src([paths.jsbundleFolder + "/**/*.js", "!" + paths.jsbundleFolder + "/**/*.min.js"])
        .pipe(uglify())
        .pipe(gulp.dest(paths.jsbundleFolder));
    });

Answer 3

在视觉工作室里，

• 创建一个新的控制台项目
• 在项目中安装块包“MSBuild.NodeTools”

• 卸载 .csproj 文件并通过在构建后目标中添加行来编辑它

     <Target Name="AfterBuild">
         <MSBuild.Gulp   GulpFile="path to your gulpfile"/>   
     </Target>
  

这里有您可以使用的所有属性：

• GulpFile：gulpfile 的路径。默认为 $(MSBuildProjectDirectory)\gulpfile.[js|coffee]。
• GulpWorkingDirectory：执行 gulp 任务的目录。默认为 $(MSBuildProjectDirectory)。
• GulpBuildTask：在构建时执行的 Gulp 任务。默认为 build-$(Configuration)。
• GulpCleanTask：干净执行的 Gulp 任务。默认为取消设置。

正如您所看到的，执行的任务采用 Visual Studio 中的配置名称，因此如果您在“debug”中构建项目，则将执行任务“build-debug”

如果您想要自定义任务，您也可以这样做：

<Target Name="AfterBuild">
<MSBuild.Gulp  Condition=" '$(Configuration)|$(Platform)' == 'Debug|AnyCPU'"  GulpFile="path to your gulpfile"  GulpBuildTask="CustomDebug"/>
<MSBuild.Gulp  Condition=" '$(Configuration)|$(Platform)' == 'Release|AnyCPU'"  GulpFile="path to your gulpfile"  GulpBuildTask="CustomRelease"/>
</Target>