Typescript + Angular 2 + ASP.Net Core 1.0 的 .html、.css 等文件应该放在哪里?

Where should .html, .css, etc. files for Typescript + Angular 2 + ASP.Net Core 1.0 be located?

Typescript tutorial to create ASP.Net Core application (with or without Angular 2) 建议我们创建文件夹 Scripts 并使用 gulp task 仅将 .js 文件复制到wwwroot 文件夹,例如在构建期间。

现在这是有道理的,但是我们如何处理 angular 2 可以利用的所有 .html、.css 等文件。好像一般有两种做法:

  1. 正在将它们添加到 wwwroot 文件夹。

    • 好处:不需要为这些静态文件添加gulp任务

    • 缺点:我们必须复制文件夹结构并进行两次copy/rename/etc操作

  2. 将它们保存在 wwwroot 之外的 Scripts 文件夹中(然后我们最好将其重命名为 Source 或类似的名称。

    • 好处:没有重复,全部在一处

    • 缺点:我们必须将它们复制到 gulp 任务中的 wwwroot

如果情况2 wwwroot变成普通应用程序的bin文件夹。

是否有关于该主题的官方 guidelines/advices(我找不到)可以用作参考?

通常人们使用方法 2,尽管大多数人(包括我)称文件夹为 "app" 而不是 "source" 或 "scripts" 并通过 gulp 复制它们。

这样做的一个原因是我们可以从源代码控制管理中排除 wwwroot 文件夹。另一个是对于生产你想捆绑你的文件(html、css 和生成的 *.js 文件),所以你的 wwwroot 文件夹将包含不同的数据集,具体取决于如果您正在开发或部署它。

而且由于它的内容会经常变化(每个 build/bundling)并且它可能会产生相当大和缩小的苍蝇,所以它不太适合源代码控制(minified/uglified/concated 文件是 hard/difficult/impossible 为)创建差异)。

对于 angular 具体而言,您希望保留 *.html、*.ts、*.js 和 *.css(仅与组件相关的那些)同样location/subfolder。 Visual Studio 会自动将它们组合在一起(即 sample.component.htmlsample.component.tssample.component.csssample.component.js 将组合在一起,您可以通过按下小三角展开它们到分组名称)并且它适用于捆绑,因为 angular2 css/template 可以使用 component relative path,如果你使用模块加载器(推荐!)。

我觉得 gulp 不是一个有用的工具,所以不要在我的模板(ng2+material+asp.net 核心)中使用它。 但需要记住 运行 "npm start" 在 运行 "dotnet run".

之前编译任何 ng2 更改

这是我的解决方案模板,您可以试试:https://github.com/Longfld/ASPNETCoreAngular2