javascript - 使用 gulp 将外部库移动到 wwwroot 文件夹

Question

我正在使用 VS 2015 + ASP.net vnext + Angular 2 + Typescript + gulp.js。我已经自动化了我的 scripts/**/*.ts文件移动到 wwwroot/app文件夹。现在我想为我的库做同样的事情，比如 Angular 2。我想要一个 gulp 进程注入(inject)

• angular.js里面index.html在<environment names="Development">里面节点；
• angular.min.js里面index.html在<environment names="Production">里面节点。

当然，我希望我的所有库都自动发生这种情况，而无需了解库:

• <any>.min.js (制作)
• <any>.js (发展)

any.js 的缩小可以由我来完成。

实际上我只需要考虑所有dependencies在package.json ...但后来我迷路了。

我的想法可以实现吗？或者是否已经存在一个工具？还是应该将工作流程分成更多手动步骤，比如我必须复制/粘贴某个库？

或者是否可以使用 dependencies命名并用 .js 连接然后在 node_modules 下搜索此文件文件夹...(有点老套而且不安全...)

更新

重新措辞/完善我的问题:

如何自动添加我的 npm dependencies (不是 devDependencies )对环境 "Development"触发特定事件时的节点，如构建/清除/等...

Answer 1

为此有一个小标签助手，称为 asp-src-include。

想象一下您想要包含一些 *.js 文件的情况:

<script src="/app/app.js"></script>
<script src="/app/controller/controllerA.js"></script>
<script src="/app/controller/controllerB.js"></script>
<script src="/app/service/userservice.js"></script>

等您可以将所有这些包含在一个“”标签中。

<script asp-src-include="~/app/**/*.js"></script>

因此对于生产/开发部署，您的 Razor 标记可能看起来像

<environment names="Development">            
    <script asp-src-include="~/app/**/*.js"></script>
</environment>
<environment names="Staging,Production">
    <script asp-src-include="~/app/**/*.min.js"></script>
</environment>

为此，您需要 @addTagHelper "*, Microsoft.AspNet.Mvc.TagHelpers"(从 RC1 或 RC2 开始，它是 '@addTagHelper *, Microsoft.AspNet.Mvc.TagHelpers' - 没有双引号 ) 声明在您的 *.cshtml 文件中或在您的 _Layout.cshtml 中。

编辑

有一个名为 gulp-npm-files 的模块做类似的事情，它将所有 *.js 文件复制到目标文件夹中。您可以在 GitHub 上查看它的来源如果您想编写自己的模块来扩展功能。

但这可能不是您想要的，因为文件夹通常包含多个文件，例如 angular2 (AngularJS 2.0) 包含许多文件(*.js 和 *.ts)，但是你主要只对编译/缩小的感兴趣，可以在 angular2/bundles/* 中找到，比如 angular2.js、angular2.min.js 或 angular.dev.js。

特定依赖项的 package.json 没有提供有关在哪里可以找到此编译文件的信息。所以我想，除非您想将所有文件复制到 wwwroot ，否则没有办法自动执行此操作，这在我看来毫无意义，尤其是如果您想使用 asp-src-include ，因为它包含的内容没有区别，所以您希望尽量减少 wwwroot 文件夹中的 *.js 文件数。

我猜你能做的最好的事情就是通过 gulp 任务手动复制依赖项，然后使用 asp-src-include 自动将它们包含到你的 razor 生成的 html 文件中。