Wie funktioniert fontawesome in Chrome Extension?

Question

Ich entwickle eine Google Chrome-Erweiterung, die auf einer bestimmten Website angezeigt wird. Und ich möchte Fontawesome in meiner Chrome-Erweiterung verwenden. Wenn ich versuche, Schriftarten zu laden, trat der Fehler GET chrome-extension://invalid/ net::ERR_FAILED auf.

Im Stylesheet sind Webfonts mit @font-face wie folgt enthalten.

Ich habe auch versucht, meine Erweiterung ID direkt einbetten, obwohl es nicht funktioniert.

Mein manifest.json:

"web_accessible_resources": ["Fonts/*.*", "*.ttf", "*.eot", "*.svg", "*.woff", "*.woff2"], 

Wie dieses Problem zu lösen?

Answer 1

Die einfachste, aber schrecklich, Art und Weise ist Fontawesome herunterladen und schließen Sie es direkt

curl -o fontawesome.js "https://use.fontawesome.com/840a321d95.js" 

und es dann hinzufügen, wo Sie es brauchen

<script src="fontawesome.js"></script> 

Answer 2

Wenn Sie Font Ehrfürchtig eine Chrome verwenden Extension's Inhaltsskript (nicht die popup.html), können Sie Folgendes tun:

Laden Sie https://use.fontawesome.com/840a321d95.js herunter, benennen Sie es in fontawesome.js um und fügen Sie es ein das Verzeichnis Ihrer Erweiterung wie in der Antwort von @wesdotcool beschrieben.

Dann fügen Sie folgende manifest.json:

{ 
    "manifest_version": 2, 
    "content_scripts": [ 
     { 
      "js": ["fontawesome.js"] 
     } 
    ], 
}