0

I have a webapp created using Vue and Quasar. In my quasar-user-options.js file I have added the required icon imports.

import '@quasar/extras/material-icons/material-icons.css'
import "@quasar/extras/material-icons-outlined/material-icons-outlined.css";

When developing locally, the icons are displayed fine. It is when the web application is deployed to an Azure App Service when the icons appear as text.

enter image description here

I have attempted to add the required @font-face and googleMaterialIcons.woff2 file as necessary to the application, but am unsure where it should be (or if it's the correct solution at all). Any suggestions/ideas?

Thanks!

christian21
  • 71
  • 6

1 Answers1

0

The App Service Sandbox will block you from installing custom fonts. The workaround is migrating your app to a container where you can leverage the image to install and configure the custom font.

Ryan Hill
  • 1,821
  • 2
  • 8
  • 21