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

Question

我正在使用 VS 2015 + ASP.net vnext + Angular 2 + Typescript + gulp.js。我已将我的 scripts/**/*.ts 文件自动化移动到 wwwroot/app 文件夹。现在我想对像 Angular 2 这样的库做同样的事情。我希望一个 gulp 进程注入

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

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

• <any>.min.js（生产）
• <any>.js（开发）

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

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

我的想法可以完成还是可能已经存在工具？还是应该将工作流程分解为更多手动步骤，例如我必须复制/粘贴某个库？

或者是否可以取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>

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

编辑

有一个名为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 文件中。

Answer 2

所以您的问题是您想将脚本自动注入到您的 HTML 中，对吗？您可以为此使用Wiredep 模块。

为了将资产复制到另一个文件夹，有许多模块可以将文件从一个文件夹复制或链接到另一个文件夹。 Gulp-copy 是我能找到的第一个。