How to add a font to ASP.NET Core Angular 2 app in Visual Studio 2017 using SpaTemplates

I am using the one page app template in Visual Studio 2017 to create an Angular 2 app.

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

      

Then create your app like this:

dotnet new angular

      

What is the recommended way to import third party libraries like font awesome into Angular 2 app?

+3


source to share


2 answers


Credit original message

This is for .NET Core 2, after creating a SPA project using dotnet new angular:



  • Go to your project root and install the package: npm install font-awesome --save. You should now see it in your package.json dependencies.

  • After that go to webpack.config.vendor.js file and add font awesome to the array under the unambiguous modules:

    const nonTreeShakableModules = ["Bootstrap", 'Boot / distance / CSS / bootstrap.css',' ES6-promise ',' ES6-shim ',' Event source-polyfill ',' Font-awesome / CSS / font awesome.css ',' JQuery ',];

  • Now we need to tell webpack that we have added this new package. So if you haven't done so before installing this in the project root with npm install --save-dev npm-install-webpack-plugin.

  • Finally, run this command in your project root: webpack --config webpack.config.vendor.js

+3


source


I was looking for the same thing.

Finally found the answer here: http://blog.stevensanderson.com/2016/10/04/angular2-template-for-visual-studio/

Don't forget to do:



webpack --config webpack.config.vendor.js

and also make sure you restart the ASP.NET Core pipeline as well.

Hello

+5


source







All Articles