Скачивание и локальное подключение

Библиотека iziToast распространяется в виде файлов JavaScript и CSS, которые можно подключить к проекту локально. Локальное подключение удобно для проектов, где важно не зависеть от внешних CDN, обеспечивать стабильную загрузку и возможность полной кастомизации.

Скачивание файлов

  1. Официальный сайт и репозиторий Все актуальные версии iziToast доступны на GitHub: https://github.com/marcelodolza/iziToast

  2. Выбор версии В репозитории можно выбрать последнюю стабильную версию или скачать архив с исходниками. Для учебных и продакшн-проектов рекомендуется использовать стабильную версию.

  3. Необходимые файлы Для корректной работы iziToast необходимы два файла:

    • iziToast.min.css — стили для уведомлений
    • iziToast.min.js — основной скрипт библиотеки

    Обычно они находятся в папке dist после распаковки архива.

Структура проекта для локального подключения

Пример организации проекта с локальными библиотеками:

project/
│
├─ index.html
├─ js/
│   └─ iziToast.min.js
├─ css/
│   └─ iziToast.min.css
└─ assets/
    └─ images/

Размещение файлов CSS и JS в отдельных папках (css и js) позволяет поддерживать чистую структуру проекта и легко управлять зависимостями.

Подключение CSS

Файл стилей подключается в <head> HTML-документа:

<link rel="stylesheet" href="css/iziToast.min.css">

Особенности подключения:

  • Путь должен быть корректным относительно HTML-файла.
  • Используется тег <link> с атрибутом rel="stylesheet".
  • Можно подключать несколько файлов стилей, iziToast должен быть подключен после общих стилей страницы, чтобы корректно отображались уведомления поверх других элементов.

Подключение JS

Файл библиотеки подключается перед закрывающим тегом </body>:

<script src="js/iziToast.min.js"></script>

Рекомендации по подключению:

  • Размещать скрипт внизу страницы для ускорения загрузки основного контента.
  • Проверять, что iziToast подключен после зависимостей (если они есть), например jQuery, хотя библиотека работает и без него.
  • Использовать минифицированную версию iziToast.min.js для продакшн-проекта, чтобы уменьшить размер загрузки.

Проверка подключения

После подключения библиотек можно выполнить простую проверку работы iziToast:

<script>
    iziToast.show({
        title: 'Успех',
        message: 'iziToast подключен локально',
        position: 'topRight'
    });
</script>

Если уведомление появляется на странице, подключение выполнено корректно. Ошибки в консоли браузера обычно указывают на неверные пути к файлам или отсутствие необходимых файлов.

Преимущества локального подключения

  • Независимость от интернета: уведомления работают даже без доступа к CDN.
  • Контроль версий: можно фиксировать конкретную версию библиотеки и исключить несовместимости.
  • Возможность кастомизации: стили можно модифицировать под дизайн проекта без вмешательства в внешние ресурсы.

Рекомендации по поддержке

  1. Хранение актуальной версии — обновлять локальные файлы при выходе новых стабильных релизов.
  2. Минификация и объединение — при продакшн-сборке объединять iziToast с другими скриптами для оптимизации загрузки.
  3. Кэширование браузера — использовать HTTP-заголовки для кэширования CSS и JS, чтобы ускорить повторные посещения.

Локальное подключение iziToast обеспечивает полный контроль над библиотекой, облегчает настройку уведомлений и гарантирует стабильную работу без зависимости от внешних серверов.

Оглавление