Upgrading .NET Core Videos to .NET Core 2.0 and Angular v5

Today I finally found some time to finalize the upgrade of my .NET Core Videos project to the recent versions of the framework:

  • Angular 5
  • .NET Core 2.0

I wanted to share some thoughts about the upgrade process, which went quite well, as opposed to what I have experienced when working with Angular in the past (in the first version of Angular2 packages).

.NET Core

First I had to upgrade .NET Core version from v1.1 to v2.0.

That’s where the first surprise comes in – I found a clear explanation on the Microsoft Docs website. I’ve actually followed the guideline aaaaaand it went just fine.

Microsoft, good job here!

Angular

Next, I wanted to upgrade Angular from v4 to v5. Learned from the previous step experience I believed it should be also same easy, but it was a bit more difficult due to the JavaScriptServices dependency.

I first googled for upgrade tips from Google and found this Angular Update Guide.

I have followed the tips (mostly renaming template to ng-template) finalizing the process by running the scary, as always (at least for me 🙂 ) npm-install .

This guide supposedly helped out a lot of people, but in my case, it ended up with the beautiful:

An unhandled exception occurred while processing the request.

NodeInvocationException: Prerendering failed because of error: TypeError: _angular_core.InjectionToken is not a constructor
at d:\Profile\GitHub\DotNetVideosCore\ClientApp\dist\main-server.js:861:21

I have struggled a lot with the issue and finally gave up as it was already very late. Today, I got back to the topic and happily, a new version of JavaScriptServices was there (upgraded to Angular 5).

It was quite obvious to me that the reason is wrong dependency version here, or there. It’s always like this when upgrading Node apps to newer versions. So I copied the dependencies from the package.json from the angular templates for SPA apps made by Microsoft.

After next npm install I still got an error due to some wrong dependencies for the module: @ngtools/webpack which I was happy to remove from my dependencies and updating webpack to not use it for now.

Then I managed to get my app up and running, what made me very happy because I’ve planned to code a bit recently but this remaining update problem was blocking me from getting some focus on this topic.

Conclusion

The upgrade process went really well. I was expecting much more troubles here.

I was once afraid that .NET Core with all the small dependencies loaded as in NPM will fall into the same set of problems (cross-dependencies with conflicting versions) but it seems it’s not the case.

Advent of Blog

This is my sixth post in the series of Advent of Blog 2017. I will be publishing one post per day as I mentioned in my first post of the series.

Stay tuned.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.