Topic: Fonts in root of app

declan.ward premium asked 3 years ago


When I build an app many fonts and image files are placed in the output folder (root) along with the compiled js files. I am assuming this is MDB related because when I build a test app, without MDB, I do not get these image and font files.

Since I am using Angular + MDB with a .Net backend (DNN) I need to place these fonts and images elsewhere.

My difficulty is that I cannot figure out where they are referenced and how to change this.

Can you assist please.

In the console I see lots of 404 errors like these:

downloadable font: download failed (font-family: "Font Awesome 5 Free" style:normal weight:900 stretch:100 src index:1): status=2147746065 source: http://dev......com/fa-solid-900.woff2

Resources (screenshots, code snippets etc.)


Arkadiusz Idzikowski staff answered 3 years ago


Those files are used in the css file that is created in your build folder. You can open this file and search for the occurrences of the specific assets (for example, font paths are used for the font-face property).

There is an resourceOutputPath option that you can add to your angular.json file to change the output path for the assets. This change will be reflected in the generated css file as well (the paths to assets will be updated correctly).

  "architect": {
    "build": {
      "builder": "@angular-devkit/build-angular:browser",
      "options": {
        "outputPath": "dist/project-name",
        "resourcesOutputPath": "resources",
        "index": "src/index.html",
        "main": "src/main.ts",

In this example all assets will be stored in the resources folder.



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • User: Premium
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: 8.7.0
  • Device: Desktop
  • Browser: ALL
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: Yes