Рубрика: Vue

В этой статье я расскажу о процессе создания Vite-плагина, который автоматически генерирует файл index.js для экспорта Vue-компонентов, и разберу его код. Назначение плагина Плагин GenerateComponentsIndex решает несколько важных задач в проекте на Vue.js: Процесс создания плагина 1. Импорт необходимых модулей…

Одним из ключевых инструментов оптимизации является tree-shaking — процесс удаления неиспользуемого кода из финального бандла. В этой статье мы глубоко погрузимся в то, как Vite, один из самых популярных сборщиков, обрабатывает индекс-файлы и выполняет tree-shaking.

Что делает useCooldown? Функция useCooldown создает таймер обратного отсчета с двумя ключевыми особенностями: Основной функционал Параметры функции Возвращаемые значения Пример использования Базовый пример Пример с несколькими таймерами Кастомное отображение времени Особенности реализации Эта функция готова к использованию в любом проекте…

В этой статье я покажу, как создать полезный хук useCaretRestore, который сохраняет позицию курсора при изменении содержимого input-полей. Это особенно полезно при работе с текстовыми редакторами, формами и другими элементами ввода. Зачем нужен этот хук? Когда мы программно изменяем значение…

В современной веб-разработке удобство пользователя — это главный приоритет. Сегодня мы создадим мощный и гибкий composable-хук useKeyBinding для Vue 3, который позволит легко добавлять клавиатурные сокращения к input-полям вашего приложения. Зачем нужен хук useKeyBinding? Клавиатурные сокращения — это не просто…

Вот минимальная реализация компонента Error Boundary, который использует два слота: один для обычного состояния и один для отображения ошибки: Как использовать этот компонент Особенности этой реализации: Эта реализация подходит для большинства базовых случаев, когда нужно просто защитить часть приложения от…

VueUse — это коллекция композабл-функций для Vue 3 (и Vue 2 с Composition API), которые значительно упрощают разработку, избавляя от необходимости писать повторяющийся код. Библиотека предоставляет более 200 удобных хуков для работы с состоянием, DOM, браузерными API, анимациями и многим…

Архитектура Vue.js-приложения с использованием Pinia зависит от масштаба проекта и его сложности. Pinia — это официальная библиотека для управления состоянием во Vue, которая пришла на смену Vuex. Она проще в использовании, обладает TypeScript-поддержкой и более гибкая. Когда использовать Pinia? Pinia…