Wie kann man mdi in Angular2 Webpack richtig einbinden?

Question

Könnten Sie mir bitte Schritt für Schritt Anleitung (oder Link, wenn Sie welche kennen) beibringen, wie Sie Materialdesign-Icons in eckiges2 Webpack einbinden?

Ich habe es durch beide installiert npm install mdi (eine Ressource, die ich gefunden habe, hat es so erwähnt) und npm Material-Design-Icons installieren (von https://www.npmjs.com/package/material-design-icons). Ich habe es auch durch Abhängigkeiten versucht.

Aber das ist nicht genug. Wie ich es verstehe, muss ich auch zu Webpack sagen, dass er es benutzen sollte. Aber ich weiß nicht wie und ich kann nichts finden.

So jetzt bin ich mit es wie folgt aus:

<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.3/angular-material.min.css'> 
    <link rel="stylesheet" href="//cdn.materialdesignicons.com/1.4.57/css/materialdesignicons.min.css"> 

Aber das ist nicht, wie ich es tun möchte.

Jeder Rat würde geschätzt werden.

Answer 1

Ich hoffe, dass Sie jetzt die Antwort gefunden haben würde, aber wenn nicht diese Anweisung folgen

1. Material Design-Ikone über npm Install: npm install mdi --save

2. Ich hoffe, Sie könnten angular-cli werden. Wenn ja offen angular-cli.json und im "Stil" Array hinzufügen

   "styles": [ 
        "../node_modules/mdi/css/materialdesignicons.min.css" 
        ] 
   

3. Weiter im addons die Schriftart wie folgt hinzufügen

"addons": [ 
     "../node_modules/mdi/fonts/*.+(eot|svg|ttf|woff|woff2)" 
     ], 

4. Stoppen Sie die Konsole und ng server. Um dies zu testen, fügen Sie dies zu einer Komponente hinzu und überprüfen Sie. <i class="mdi mdi-sitemap mdi-24px">
5. Wenn es funktioniert, dann haben Sie erfolgreich mdi Symbole Winkel 2 Projekt