ASP.NET Core with full .NET Framework and Angular 2

Question

I want to use the Angular Single-Page Application template over at https://github.com/aspnet/JavaScriptServices/ for a new web application. But the template uses ASP.NET Core with .NET Core. I want to use ASP.NET Core with the full .NET Framework.

I tried just changing the <TargetFramework> property of the .csproj the template makes but when I try to run I get this exception page.

I tried searching Google but everything refers to .NET Core!

I'm guessing that WebPackMiddleware isn't available in the full .NET Framework? I'm at a loss.

I'm using the latest version of Visual Studio 2017.

How can I resolve this - or - is there a better starter template I should be using to have angular with ASP.NET Core and Full .NET Framework? Thanks in advance!

Please give more detail about your exception and the framework you target. If you want to use the full framework, I suggest you pick 4.7. — Hylaean
– Hylaean, Commented Jun 1, 2017 at 15:14
@Hylaean I was trying 4.6.2 but I can switch it to 4.7 I just need to install it. Here is the full exception page: gist.github.com/k-vekos/b00dea4c5df8b4b1af056bd9334dba3b — Kyle V.
– Kyle V., Commented Jun 1, 2017 at 15:23
@Hylaean Ok I switched it to .NET Framework 4.7 and the exception is exactly the same as before. — Kyle V.
– Kyle V., Commented Jun 1, 2017 at 16:38

Sanket · Accepted Answer · 2017-06-03 07:08:45Z

2

Other alternative - You can use Microsoft.AspNetCore.SpaTemplates

To install SPA templates, run following command

dotnet new --install Microsoft.AspNetCore.SpaTemplates::*

To generate a new project, use following command

dotnet new angular

Generated template provides you netcoreapp1.1

But you can change it to net462 like this- <TargetFramework>net462</TargetFramework>

Then use dotnet restore and npm install to restore NuGet and npm packages.

Once done successfully, use dotnet build and dotnet run to build and run application.

For more information, refer this blog.

answered Jun 3, 2017 at 7:08

Sanket

20.2k10 gold badges74 silver badges84 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

tone · Accepted Answer · 2017-08-21 03:12:23Z

I have successfully got this working in dot net framework and Hot Module Replacement is working fine. My working application is found here but you'll need to comment out the [Authorize] attribute in HomeController if you don't know how to configure the Authorisation properly.

When creating the project, are you using the latest version of Dot Net Core 2? I originally started with a preview release of Dot Net Core 2 and found that it didn't upgrade properly when I installed the latest version in VS2017.3, so the app broke. I had to uninstall the preview release and install the latest 2.0 version.

Secondly, have you actually installed the dot net 2.0 framework. When you open the new ASP.Net Core Web Application, it puts a yellow bar at the top of the dialog box to get you to install it.

If installed already, did you select .NET Framework and ASP.NET Core 2.0 from the when you selected the Angular project in the dialog box?

Finally, in the application itself, it needs to run npm install behind the scenes to get all the npm packages installed from the package.json file. It also needs to install nuget packages and then on the first run it executes a webpack compile.

npm may have problems with firewalls and corrupted npm cache. You can run "npm install" from the command line in your project folder. You can run "webpack --config webpack.config.vendor.js" from the command line in your project folder. If these fail it might give you a hint on why the project is not working properly.

Oh whoops, I just realised this was an old question. But hey, here's how to do it in dot net core 2.0!

Collectives™ on Stack Overflow

ASP.NET Core with full .NET Framework and Angular 2

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related