已升级的应用有效，但看起来有误 - Angular 4 to 5

Question

我花了24小时的时间尝试将从ASP.NET Core模板创建的Angular 4应用程序升级到Angular 5应用程序，但没有成功。然后，我尝试将一个全新的应用程序（无需修改）升级到Angular 5，即使该应用程序似乎有效 - 但它在视觉上都是错误的（见下图）。

我只做了几个简单的步骤，作为升级Angular 4 app的“正确方法”随处可见。我只使用了one of the tutorials，但它们或多或少都是一样的（同样tried this）。

我的环境：Node.js：8.9.4，@ angular / cli：1.6.8

重现的步骤：

1. 启动Visual Studio 2017
2. 使用Angular模板创建新的ASP.NET Core Web应用程序
3. 构建并运行。工作正常。
4. 按照Angular 5升级教程中的步骤进行操作。
5. 构建并运行。工作正常，但看起来不对。



更新

如果我只是将Angular 4项目创建的 vendors.css 复制到Angular 5项目的 wwwroot \ dist ，则外观似乎恢复正常。

Answer 1

经过2天的研究，我找到了解决这个问题的方法，问题是在更新期间你已经将bootstrap更新到v.4.0.0来修复它我已经将bootstrap降级到v.3.3.7，如下所示： / p>

1. 打开visual studio。
2. 打开packages.json。
3. 查找引导条目并将版本更改为3.3.7。
4. 关闭视觉工作室。
5. 在应用程序的根文件夹中打开电源shell。
6. 运行npm install
7. 运行webpack --config webpack.config.vendor.js
8. 打开visual studio并运行您的项目。