5.12.1 Fontawesome значки не компилируются с Sass - PullRequest
Новая
       7

5.12.1 Fontawesome значки не компилируются с Sass

0 голосов
/ 21 февраля 2020

FontAwesome 5.12.1 - последняя версия Dart Sass - последняя цель, чтобы значок fa-phone работал с использованием <i class="fa fa-phone"

Это результат скомпилированного файла. css: 

fa-phone:before{content:""}

содержимое отсутствует \ f095

Это структура моей папки 

main
^---fontawesome-free-5.12.1-web/
    ^---css/
    ^---js/
    ^---less/
    ^---metadata/
    ^---scss/
    ^---sprites/
    ^---svgs/
    ^---webfonts/
^---projectX/
    ^---project.scss
    ^---_customvariables.scss
    ^---_basecss.scss

В проекте X у меня есть мой проект.s css, _customvariables.s css, _basecss In мои _customvariables Я изменяю прокомментированные //$fa-font-path: "../webfonts" !default; на 

$fa-font-path:         "../fontawesome-free-5.12.1-web/webfonts";
//$fa-font-size-base:    16px !default;
...

Это должно удовлетворять структуре папок, но я не думаю, что это ???

Я пытаюсь все виды кода в мой файл проекта.s css здесь является примером: 

@import "customvariables";
@import "../fontawesome-free-5.12.1-web/scss/variables";
@font-face {
  font-family: 'Font Awesome 5 Free';
  font-style: normal;
  font-weight: 900;
  font-display: $fa-font-display;
  src: url('#{$fa-font-path}/fa-solid-900.eot');
  src: url('#{$fa-font-path}/fa-solid-900.eot?#iefix') format('embedded-opentype'),
  url('#{$fa-font-path}/fa-solid-900.woff2') format('woff2'),
  url('#{$fa-font-path}/fa-solid-900.woff') format('woff'),
  url('#{$fa-font-path}/fa-solid-900.ttf') format('truetype'),
  url('#{$fa-font-path}/fa-solid-900.svg#fontawesome') format('svg');
}

.fa,
.fas {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
}

@import "../fontawesome-free-5.12.1-web/scss/mixins";
@import "../fontawesome-free-5.12.1-web/scss/core";
@import "../fontawesome-free-5.12.1-web/scss/larger";
@import "../fontawesome-free-5.12.1-web/scss/fixed-width";
@import "../fontawesome-free-5.12.1-web/scss/list";
@import "../fontawesome-free-5.12.1-web/scss/bordered-pulled";
@import "../fontawesome-free-5.12.1-web/scss/animated";
@import "../fontawesome-free-5.12.1-web/scss/rotated-flipped";
@import "../fontawesome-free-5.12.1-web/scss/stacked";
@import "../fontawesome-free-5.12.1-web/scss/icons";
@import "../fontawesome-free-5.12.1-web/scss/screen-reader";
@import "basecss";

Ничто не заполнит контент, я прочитал много веб-статей, которые пытаются объяснить это, но они не получают достаточно c уважение к структуре папок и относительным путям.

Может ли кто-нибудь пролить свет на эту тему.

Кстати, даже если я скомпилирую стандартный пакет fontawesome из загруженного пакета, Я тоже получаю такой же плохой результат. Когда я включаю мою команду наблюдения, она немедленно ее компилирует, и при создании. css нет \ f095 в качестве значений содержимого для каждой иконки.

Я также попытался поместить webfonts et c в мою папку ProjectX для компиляции и, соответственно, подправив путь.

Я прихожу к выводу, что последняя версия не работает.

Я попробую другую версию.

все мои bootstrap компиляции работают нормально.

...