这篇文章是Silbird Advent Calendar 2017的第12天的文章。

最开始

2017年8月发布了ASP.NET Core2，2017年11月发布了Angular5！今年我受益于C#和ASP.NET。为了备忘，我想写一篇关于环境搭建的入门文章。顺便一提，自从2017年7月下旬的Chrome60版本开始，Lighthouse已经集成到Audits中了，虽然与标题无关，但我想试一下！

ASP.NET + Angular可以被简化为ASP.NET与Angular的组合。

发布说明/变更日志

ASP.NET:
请访问以下链接以获取ASP.NET的最新版本:
https://github.com/aspnet/Home/releases

Angular:
https://github.com/angular/angular/blob/master/CHANGELOG.md
https://medium.com/angular-japan-user-group/version-5-0-0-of-angular-now-available-9746ef966c7d

Angular（角 ）：
https://github.com/angular/angular/blob/master/CHANGELOG.md
https://medium.com/angular-japan-user-group/version-5-0-0-of-angular-now-available-9746ef966c7d

开发环境

• macOS Sierra 10.12.6

• Visual Studio for Mac

• node v9.2.1

dotnet 2.1.2

搭建环境

以下模板也已准备好：
– Aurelia
– Knockout.js
– Vue.js
– React.js

文件组织结构

在ClientApp下安装了组件。
也默认安装了单元测试库，如Karma / Jasmine。

如果是Mac的情况，检查package.json文件可以看到它是Angular4系的，所以如果要从这个版本升级到5系，请参考这里（实际上，我觉得可以通过版本指定方式来下载）。

审计

根据图片，展示PWA/性能/可访问性/最佳实践中的四个分类的评分。

从个人角度来看，我更关注关键渲染路径（即与用户操作相关的内容展示优先级排序）和渲染处理（减轻FPS处理负担和充分利用GPU），主要从DOM树和CSSOM树的角度去考虑。因此，我特别关注First Meaningful Paint（即用户能够看到有意义内容的时间点）相关的内容。

稽核/燈塔參考：
https://developers.google.com/web/tools/lighthouse/

給你額外的禮物

可以参考

在Mac上使用Visual Studio创建一个新的Angular项目
https://stackoverflow.com/questions/44831899/creating-a-new-angular-project-on-mac-with-visual-studio

使用Angular 5和ASP.NET Core入门
http://www.c-sharpcorner.com/article/getting-started-with-angular5-and-asp-net-core/