Генератор йомен шрифт потрясающий

Я создал мобильное приложение с помощью мобильного генератора yoman.
Теперь я хочу добавить потрясающий шрифт. Я попробовал это, но не работает в процессе компиляции. Небольшой совет или опыт был бы замечательным

Ладно, правда немного непонятно. Извини.
Процесс компиляции работает, но консоль говорит, что 404 не найдено для шрифтов.
Мне не совсем понятно, как это сделать. Создание CSS из файлов scss, реализация .min.css в index.html с помощью «‹-- build: ... -->» или что-то еще?!

Когда я добавлю это в свой основной файл .scss, шрифты не будут найдены.

$fontAwesomePath: "../bower_components/font-awesome/fonts";
@import '../bower_components/font-awesome/scss/font-awesome.scss';

Grunt копирует и переименовывает файлы шрифтов, например. к:

5a6b8fb8.FontAwesome

font-awesome gruntjs yeoman-generator yeoman
person chris    schedule 04.11.2013    source источник
comment
Если у вас есть проблемы с компилятором, опубликуйте ошибки... Никто не сможет вам помочь, если вы не приложите немного усилий, чтобы прояснить свой вопрос.   -  person Macmade    schedule 04.11.2013

Ответы (3)


arrow_upward
2
arrow_downward

Похоже, grunt rev https://github.com/cbas/grunt-rev переименовывает ваш шрифт файл. Просто найдите что-то подобное в своем Gruntfile:

// Renames files for browser caching purposes
rev: {
  dist: {
    files: {
      src: [
        '<%= yeoman.dist %>/styles/fonts/*'
...

удалите строку шрифтов, и все будет в порядке.

person bpaul    schedule 28.01.2014
comment
Нет проблем, дайте мне знать, если вам нужна дополнительная помощь - person bpaul; 29.01.2014
comment
Спасибо за ответ, чем вы копируете файлы шрифтов в папку dist? вы добавили задачу копирования? - person Urigo; 17.04.2014
comment
Да, я просто добавляю стили/шрифты/* в src под задачей копирования: src: ['*.{ico,png,txt}', '.htaccess', 'images/{,*/}*.{webp}', 'styles/fonts/*'] - person bpaul; 22.04.2014

arrow_upward
2
arrow_downward

Хорошо,
кажется, я мог исправить это с помощью этого ответа.
Установленный шрифт awesome с беседкой:

bower install --save font-awesome


Тогда просто эта строка в index.html решила мою проблему.

<!-- build:css styles/vendor/fontawesome.css -->
<link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css">
<!-- endbuild -->


Спасибо @OddEssay и @bpaul за помощь!!

person chris    schedule 29.01.2014

arrow_upward
1
arrow_downward

@importing scss заботится о стороне CSS, но я думаю, вам также нужно переместить ресурсы в место, где браузер может получить к ним доступ, поэтому grunt-contrib-copy прекрасно справится с этой задачей. Итак, если ваш веб-сайт public Что-то вроде:

copy: {
      main: {
        files: [
          {expand: true, cwd: '../bower_components/font-awesome/fonts', src: ['*.*'], dest: 'public/fonts'}
               ]
      }
person OddEssay    schedule 07.11.2013
comment
Благодарю. но проблема, я думаю, в том, что grunt переименовывает шрифты, а исходный путь к шрифту не правильный. - person chris; 07.11.2013
comment
Файлы нужно копировать, но в этом случае проблема связана с grunt rev. Смотрите мой ответ ниже. - person bpaul; 28.01.2014