前言
自从.NetCore2.1发布之后，一直碎碎念着了解下最新框架；最近终于有时间了，恰逢Angular发布了6.2版本，一切都是安排好的...
之前并没有接触过Angular，只是知道它是基于MVC思想发展起来的前段框架（对此没有任何概念）。在了解过程中才发现，真是强大到不止一点点。
不唠了，直接上干货！
- 安装Node.js
- 更新NPM的包地址
- 通过NPM安装Angular CLI模块；
- VS2017新建项目.NetCore Web项目
- 添加Angular CLI模块到项目中；
- 更新Angular输出文件目录
- 更新项目生成输出地址
- 安装Angular的依赖项
- 编译Angular项目
- 更新WebCore项目注入服务和中间件
- F5运行看结果
安装Node.js
根据电脑下载合适的版本，推荐稳定版；安装Node.js会自动安装NPM包管理器，VS2017也集成了NPM包管理器，大概和Nuget差不多的存在；可以执行命令行看到已经安装
Node.js下载
更新NPM的包地址
默认NPM包地址，安装包依赖会出现错误。可能我的电脑是个例外<>! 建议更新为淘宝国内的链接
--原生
metrics-registry = "https://registry.npmjs.org/"
--淘宝
metrics-registry=https://registry.npm.taobao.org
--执行命令行
npm config set metrics-registry https://registry.npm.taobao.org
可以打开这个文件看执行成功
通过NPM安装Angular CLI模块
这个没什么说的，通过Npm包管理器的命令行界面，安装Angular CLI模块，需要注意的是如果安装失败要记得清空NPM缓存；可以调用命令行查看安装成功；
--安装命令 其中-g指全局安装，和windows的pash变量一样
npm install -g @angular/cli
--安装失败后，清除缓存
npm uninstall –g @angular/cli
npm cache clean --force //最新版需要加上 --force才能清楚
如图：
VS2017新建项目.NetCore Web项目
老套路点点点就可以了，使用MVC模式创建网站；至于勾选新建GIT存储库，是为了源码管理；
我们输入解决方案的名字 CoreAnugularWeb
添加Angular CLI模块到项目中
终于到二者融合的地方了；Window 运行调出cmd命令行，因为我们创建解决方案的时候勾选了为解决方案创建目录，现在的目录结构是这样
下一步 cd 到项目的根目录的上一级执行添加命令；
所以添加成功之后，我们的解决方案会出现很多新的文件，这些是Angular的项目文件；我们做一下改动将src这个目录名称改为ClientApp 这样正式一点...
到此我们的网站雏形就出来了；
--skip-install 跳过下载包，等编译Angular再下载
ng new CoreAnugularWeb --skip-install
更新Angular输出文件目录
Angular默认有自己的输出路径,但那不是我们想要的；修改angular.json 配置文件中 outputPath的值为wwwroot；因为我们更新了src文件夹的名称，所以需要批量修改src路径为ClientApp ;
- 简单说一下，Angular 6的配置文件改为了 angular.json 不再是angular-cli.json
更多文件详情进入官网介绍
Angular目录详情介绍
安装Angular的依赖项
刚才我们往项目中添加Angular时并没有下载依赖的安装包，现在可以下载依赖了;通过管理员模式cd到项目的根路径，执行命令行。下载的包比较多耐心等待
npm install
这一步经常出现提示权限不足的问题，可以尝试切换命令行工具为 Power shell 重新执行 或者 执行清除缓存的命令行
npm cache clean --force
编译Angular项目
安装完成后，需要编译Angular项目；并生成文件到我们指定的wwwroot目录下；
更新WebCore项目注入服务和中间件
最后一步，需要更新我们WebCore网站的生成方法；
在解决方案中打开startup文件。
简单看一下微软对这个文件的介绍，其实就是注入服务以及服务的处理方法也就是所谓的管道
不明觉厉，甭管他直接上
- 在ConfigureServices服务中注入
services.AddSpaStaticFiles(configuration =>
{
configuration.RootPath = "wwwroot";
});
- 在Configure中调用
app.UseSpaStaticFiles();
F5运行看结果
到此结束，F5走起
总结：
感觉好麻烦，因为Angular不能随着VS编译 自动编译，而是需要自己来。这一点有大神已经解决，但是实在不想看了。把链接放在下边自己来吧
查看的资料
本文大部分依赖于此大神的文章 Net Core构建Angular4应用程序
Angular的官方文档 官方文档
微软官方NetCore文档
官方NetCore文档
