Свои расширения JS - подключение вместо россыпи файлов
Расширение - это способ сказать «мне нужен вот этот код» вместо перечисления файлов и слежки за порядком их загрузки.
Что общего у этих задач
Зависимости объявляются один раз, в описании расширения. Дальше платформа сама решает, что и в каком порядке подключить на странице.
Подключение идёт по имени, а не по пути. Файлы внутри расширения можно переименовать и разложить иначе, и ни одна страница об этом не узнает.
Свой код живёт вне каталога платформы. Каталог ядра обновляется, и всё положенное туда исчезает при первом же обновлении продукта.
Решения подтемы
- Своё расширение JS: каталог, зависимости, подключение - из чего состоит расширение и как его подключают.
- Окна и уведомления ядра UI: подтверждение, окно, сообщение - готовые окна, уведомления и своё содержимое.
- Кнопки, меню и диалоги ядра UI - кнопка с ожиданием, серверная кнопка, меню и диалог.
- Клиентский код в шаблоне: инициализация, делегирование, дубли - повторный вывод шаблона, делегирование, передача данных.
- Cannot read properties of undefined: разбор причин на витрине - расширение, узел разметки, ответ сервера, старый файл.
- Сборка фронтенда рядом с шаблоном: исходники, бандл, приложение - исходники и бандл, монтирование, запросы, выкладка.
- Vue-приложение на странице: запуск, компоненты, данные - штатная обёртка Vue, компоненты, мост к платформе, ограничения.
- Расширение JS не подключается: разбор причин - имя и дерево папок, зависимости, пересборка, объединение.
- Боковая панель: открытие страницы, события, запрет закрытия - вызов по адресу, ширина и кэш, события, запрет закрытия.
- Объединение CSS и JS: включение, исключения, поломки - флаги оптимизации, каталог наборов, исключение файла, разбор поломок.
- Кастомизация Vue-компонента: мутация, клон, порядок загрузки - мутабельный и классический компонент, мутация, клон, порядок загрузки.
Частые вопросы
Чем расширение лучше подключения файла?
Оно тянет за собой свои зависимости и подключается один раз. Порядок загрузки при этом решает платформа.
Где размещать свои расширения?
В каталоге скриптов рядом с сайтом или внутри своего модуля. Каталог ядра для этого не подходит.
Нужна ли сборка исходников?
Для современного синтаксиса - да, готовым сборщиком платформы. Простой код работает и без неё.
Как передать данные из PHP в расширение?
Отдельным вызовом с параметрами после подключения. Складывать их в глобальные переменные не нужно.
Связанные темы
- Ядро JS - что даёт базовое расширение
- Подключение ресурсов - файлы вне расширений
- Запрос к серверу из браузера: действие, ответ, ошибки - как расширение общается с сервером
- Шаблон сайта на практике: стили, скрипты, области - подключение на уровне сайта
- Раздел Фронтенд и интерфейсы