1.1.2 • Published 10 months ago

holiverse-icon-font-plugin v1.1.2

Weekly downloads
-
License
MIT
Repository
-
Last release
10 months ago

Holiverse Icon Font Plugin

  • holiverse-icon-font-plugin
  • это плагин для генерации и использования иконок в формате шрифтов на основе SVG-файлов. Плагин позволяет легко подключать и использовать сгенерированные шрифты в Vue-проектах.
  • Установка
  • Установите плагин в ваш проект с помощью yarn или npm:

yarn add holiverse-icon-font-plugin

или

npm install holiverse-icon-font-plugin Генерация новых шрифтов Чтобы создать новые шрифты из SVG-иконок:

  • Подготовьте SVG-файлы:

Поместите все SVG-файлы в папку icons/ вашего плагин-проекта. Названия файлов должны быть в формате имя_иконки.svg. Например:

icons/ home.svg user.svg settings.svg

  • Запустите команду: yarn build После выполнения команды в папке dist/fonts появятся сгенерированные файлы:

dist/ fonts/ my-icons.css my-icons.woff my-icons.woff2 my-icons.ttf

  • Добавьте новые SVG-файлы:

Если вам нужно добавить новые иконки, просто положите соответствующие SVG-файлы в папку icons/ и снова выполните команду yarn build

  • Использование плагина в проекте
  • Подготовьте файлы шрифтов:

Скопируйте файлы из dist/fonts/ вашего плагин-проекта в папку public/fonts/ вашего основного проекта:

public/ fonts/ my-icons.css my-icons.woff my-icons.woff2 my-icons.ttf Подключите плагин:

В main.js подключите плагин и укажите путь к файлу CSS:

import IconFontPlugin from 'holiverse-icon-font-plugin'; import { createApp } from 'vue'; import App from './App.vue';

const app = createApp(App);

app.use(IconFontPlugin, { fontPath: '/fonts/my-icons.css', // Путь к вашему CSS-файлу });

app.mount('#app'); Используйте иконки в компонентах:

Теперь вы можете использовать иконки в вашем проекте. Например:

  • Примечания

Форматы шрифтов: Плагин генерирует файлы в форматах woff, woff2, и ttf. CSS-файл автоматически подключает их через @font-face. Добавление новых иконок: Чтобы добавить новую иконку, просто поместите SVG-файл в папку icons/ и выполните команду yarn build для обновления шрифтов. Кастомизация: Вы можете изменить конфигурацию шрифтов, редактируя файл svgtofont.config.js. Лицензия Этот плагин распространяется под лицензией MIT.

1.1.2

10 months ago

1.1.1

10 months ago

1.1.0

10 months ago

1.0.9

10 months ago

1.0.8

10 months ago

1.0.7

10 months ago

1.0.6

10 months ago

1.0.4

10 months ago

1.0.3

10 months ago

1.0.2

10 months ago

1.0.1

10 months ago

1.0.0

10 months ago