Запретить svg-перевод fontawesome
У меня проблема с angular и font awesome. В первом поколении списка значков внезапно все значки на основе классов css переводятся в svg. Влияет только на сплошные значки. Например :
<i class = "fas fa-2x fa-minus-square"></i>
переводится как-то на
<svg _ngcontent-c16 = "" class = "svg-inline--fa fa-minus-square fa-w-14 fa-2x"
ng-reflect-ng-class = "fas fa-2x fa-minus-square" aria-hidden = "true" data-prefix = "fas" data-icon = "minus-square"
role = "img" xmlns = "http://www.w3.org/2000/svg" viewBox = "0 0 448 512" data-fa-i2svg = "">
<path fill = "currentColor"
d = "M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zM92 296c-6.6 0-12-5.4-12-12v-56c0-6.6 5.4-12 12-12h264c6.6 0 12 5.4 12 12v56c0 6.6-5.4 12-12 12H92z">
</path>
</svg>
<!-- <i _ngcontent-c16 = "" class = "fas fa-2x fa-minus-square" ng-reflect-ng-class = "fas fa-2x fa-minus-square"></i> -->
Есть ли способ предотвратить эту ситуацию? Заставить как-нибудь перевод?
Это может быть проблематично. Например, я не могу использовать сплошные значки :(
Ответы 2
Если вы хотите, чтобы Font Awesome не заменял автоматически теги <i>, которые выглядят как значки, соответствующими <svg>, вы можете изменить конфигурацию отключить autoReplaceSvg.
Если вы загружаете через тег <script>, это может выглядеть так (обязательно выполните конфигурацию перед loading Font Awesome):
<head>
<script type = "text/javascript">
// Notice how this gets configured before we load Font Awesome
window.FontAwesomeConfig = { autoReplaceSvg: false }
</script>
<script src = "fontawesome.js"></script>
<script src = "fa-solid.js"></script>
</head>
Или, если вы создаете свой собственный пакет и можете получить доступ к конфигурации из собственного скрипта, вы можете сделать это:
import fontawesome from '@fortawesome/fontawesome'
fontawesome.config = { autoReplaceSvg: false }
У меня была та же проблема, тег значка был фактически переведен в SVG, когда я проверял элемент.
Проблема заключалась в том, что я загружал потрясающий шрифт как через вызовы CSS, так и через JS. Когда я удалил вызов JS lib и вызвал только файл CSS, значки отрисовывались правильно.
Спасибо вам, ребята. Мне это тоже помогло.
Мне то же. Удаление импорта файла JS устранило эту проблему, а также другую проблему, когда переключение между сплошными и обычными значками в приложении Vue.js не работало.