Bootstrap 4 on Single Page Application Angular + .Net Core

Question

Anyone tried to make an application with

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

? like in this example ht

Answer 1

For the sake of clarity, this is what worked for me.

1. Open your Angular SPA solution in Visual Studio
2. Open package.json and update the bootstrap entry to "bootstrap": "4.0.0", or whichever version you require
3. Close the solution in Visual Studio
4. Open the project folder and delete the node_modules folder
5. Open up a command prompt for the project folder
6. Run npm install popper.js --save in command prompt
7. Run npm install in command prompt
8. Run webpack --config webpack.config.vendor.js in command prompt
9. Open the solution in Visual Studio
10. Build the solution, after which you should be fully upgraded

A couple of notes:

• This requires that you have node/npm and webpack installed globally (I think!)
• On a couple of occasions I saw errors from npm/webpack in command prompt. When this occurred I just re-ran the failing command and continued once it was successful.
• If you're using source control, you'll notice that the npm-shrinkwrap.json has been heavily modified. I believe this is to do with upgraded versions of npm, but I'm no expert. Here's some further reading on the subject What is the difference between npm-shrinkwrap.json and package-lock.json?

I've also put together a working sample of the template on GitHub here https://github.com/alterius/AngularSPABootstrap4