Dans mon application angulaire 2, j'ai changé de CSS cru à moins que je puisse écrire: au lieu d'empiler des noms de classe partout dans mon HTML. Pour que cela fonctionne, j'avais besoin de: dans à renommer mon dans le composant moins, pour pouvoir faire référence aux classes de bootstrap, je devais: Cela fonctionne bien, sauf que je reçois maintenant 404 erreurs dans la console du navigateur: J'ai essayé quelques variations sur @ icon-font- chemin sans succès. J'ai vérifié les demandes de polices de l'onglet Réseau et voir J'ai également essayé d'utiliser des Sass / SCSS. Cela nécessite le module supplémentaire bootstrap-sass avec une directive similaire include, mais le résultat est exactement le même. Quelle est la bonne façon de le faire sans avoir 404 erreurs? Ceci est Servi par
angulaire-cli.json , changement:
"par défaut": {
"STYLEXTEXT": "CSS",
"Prefixinterfaces": faux
}
"stylectext": "moins",
foo.component.css à foo.component.less et mettez à jour le foo.component.ts en conséquence.
@import "~ bootstrap / moindre / bootstrap";
http: // localhost: 4200 / 448c34a56d699c29117Andc64c43affebeb.woff2 . NG Servez , c'est tout par défaut là-bas.
3 Réponses :
Angular-cli va regrouper votre police comme ceci 448C34A56D699C29117ADC64C43AFFEB.WOFF2. Si vous souhaitez les fichiers bruts, vous devez peut-être les publier sur votre serveur ...
Je préférerais avoir moins / SCSS utiliser cette police groupée à la place. Mais aucune idée de la façon de faire cela puisque je n'importe que les définitions de mon moins dossier.
Mais le problème est avec jQuery, pas avec angulaire et css. N'est-ce pas?
Si vous souhaitez demander http: // localhost: 4200 / node_modules / certains_file Vous devez l'exposer avec un alias ou un proxy. Dans Dev Environnement, vous pouvez créer un fichier proxy.conf.json comme indiqué ici: webpack.github.io/docs/webpack-dev-server.html#proproxy et lancez votre serveur avec ng serveur --proxy-config proxy.conf.json
J'ai eu le même problème avec Sass: Donc, pour moins de moins être dans vos styles.less:
Ceci est la solution correcte. Cela n'a pas fonctionné pour moi lorsque vous avez répondu apparemment parce que je l'avais inclus dans un fichier spécifique, pas les styles de maître.scss. (Je suis passé à Sass dans la période moyenne) Migration vers l'angulaire 4, les tests échouaient à cause de ces avertissements. Ajout de ces deux lignes au sommet des styles.Scss résoudis. Il aurait pu être un problème supplémentaire dans les 2 angulaires fixés sur 4 angulaires, difficiles à raconter.
@Ericdarchis Il n'était pas question dans Angular 2, vous avez dû l'importer dans le CSS principal et passer à SCSS
Essayez: ANGULAR-CLI Exécuter enfin Pour garder tout en Sync Essayez: P> NG Définir par défaut.styleext SCSS CODE> ng init Code> Vérifiez les modifications apportées à tous les fichiers générés automatiquement p> NG Build code> p> "assets": [ "assets", "favicon.ico" ]
J'ai essayé à la fois moins et SCSS. NG Set défaut.styleext ne modifie réellement la ligne dans ma question. C'est aussi très buggy et a tendance à gâcher l'angulaire-cli.json mais qui n'est pas pertinent ici. Quoi qu'il en soit, tous les actifs sont là, les polices incluses. Et ils travaillent. C'est juste que, y compris le bootstrap, moins dans mon composant.Les essaie de localiser les polices avec son nom complet plutôt que de l'emballage.
Avez-vous une sorte de .htacces qui cache " localhost: 4200 / nœud_modules / bootstrap / polices / Bootstrap ... "en tant que route au lieu d'un fichier?
Non liée au problème, mais vous voulez probablement importer par Référence . Sinon, il inclura toute la bootstrap dans vos styles de composants, ce qui pourrait ne pas être ce que vous voulez. Par exemple.
@import (Référence) "~ BOOTSTRAP / MOINS / BOOTSTRAP"; et n'exparte que des classes dont vous avez besoin (voir l'article).Mike: C'est un simple service NG, il n'y a donc rien de spécial qui pourrait interférer. YAROSLAVADMIN: Très intéressant, merci. N'aide pas mais je vais l'utiliser.
Utilisez-vous bootstrap 3 ou 4?