Konrad
Konrad

Reputation: 4772

Angular PrimeIcons work locally but not on IIS

I'm using primeicons and primeng in my angular app.

If I'm running the angular website/app locally, everything is fine.

But deploying to an IIS server, the icons are not shown - but all other styles are running well.

Is this something in the configuration of the IIS?

Usage in code:

<i class="pi pi-exclamation-circle">

styles in the angular.json:

"styles": [
              "node_modules/bootstrap/dist/css/bootstrap.min.css",
              "node_modules/primeicons/primeicons.css",
              "node_modules/primeng/resources/themes/nova-light/theme.css",
              "node_modules/primeng/resources/primeng.min.css",
              "node_modules/primeflex/primeflex.css",
              "src/styles.less"                            
            ],

dependencies in the package.json:

"dependencies": {
    "@angular/animations": "^9.1.12",
    "@angular/cdk": "^9.2.4",
    "@angular/common": "^9.1.12",
    "@angular/compiler": "^9.1.12",
    "@angular/core": "^9.1.12",
    "@angular/forms": "^9.1.12",
    "@angular/material": "^9.2.4",
    "@angular/platform-browser": "^9.1.12",
    "@angular/platform-browser-dynamic": "^9.1.12",
    "@angular/router": "^9.1.12",
    "angular2-jwt": "^0.2.3",
    "bootstrap": "^4.5.2",
    "chart.js": "^2.9.3",
    "moment": "^2.27.0",
    "primeflex": "^1.3.1",
    "primeicons": "^3.0.0",
    "primeng": "^9.1.3",
    "rxjs": "~6.5.4",
    "tslib": "^1.13.0",
    "zone.js": "~0.10.2"
  },

Upvotes: 0

Views: 1009

Answers (1)

Konrad
Konrad

Reputation: 4772

The solution was to add an exception for woff and ttf files in the web.config:

<?xml version="1.0" encoding="utf-8"?>
  <configuration>
    <system.webServer>
      <rewrite>
        <rules>
          <rule name="SPA" stopProcessing="true">
            <match url="^(?!.*(\.js|\.css|\.png|\.jpg|\.ico|\.svg|\.ttf|\.woff|\.eot)).*$" />
            <conditions logicalGrouping="MatchAll" />
            <action type="Rewrite" url="/"  appendQueryString="true" />
          </rule>
        </rules>
      </rewrite>
    </system.webServer>
  </configuration>

Upvotes: 0

Related Questions