Как пользоваться браузером со шрифтами

Question

Так что обозревате все, используя JavaScript во время выполнения, даже CSS. Но как я могу обрабатывать шрифты, такие как font-awesome с npm и браунировать.

A npm pacakge существует здесь: https://www.npmjs.org/package/font-awesome Но как я могу связать шрифты для моего браузера, не используя другой инструмент, такой как grunt или gulp.

// редактировать

Если я хочу, чтобы теперь использовать класс фа в моем HTML, есть еще один способ, чем указывать на node_modules/font-awesome/css/font-awesome.css в моем HTML файл?

Я ищу автоматическое решение, потому что, если у меня есть несколько библиотек, таких как font-awesome, и они приносят свои собственные ресурсы, такие как шрифты, изображения и другие файлы, я не хочу указывать на каждый файл активов вручную мой html-файл.

С jade я могу просто обслуживать некоторые файлы в public. И public содержит все активы, которые поступают через мои удаленные зависимости, например, шрифты, изображения, ... Но как копировать или символически связывать все файлы с определенного node_modules с public автоматически?

Answer 1

Я знаю один простой способ сделать это. Используйте свои шрифты в формате Base64. Таким образом, данные шрифта покоятся внутри самого CSS, а не во внешних файлах.

Затем просто загрузите свой CSS в свой браузерный способ (с помощью таких модулей, как «insert-css» или «cssy». Я использую «стилизовать», потому что я использую Stylus), и поскольку он передает определения CSS, он также будет несут данные шрифта.

Сжатие кода Base64 заранее также является хорошей идеей. Или, может быть, пусть Uglify сделает компрессию в конце. Сравните результаты.

Сделайте двойную проверку поддержки целевых браузеров для шрифтов Base64.