Вопрос или проблема
У меня есть серьезная проблема с файлами в моем build каталоге после выполнения команды wp-scripts build. Ни один из них не работает, когда я пытаюсь запустить свой плагин. Каталог build раньше содержал файлы вроде index.js, index.js.map, index.css и index.css.map. Теперь у меня есть файлы с названиями 134.css, 134.js и 855.js, чтобы упомянуть лишь некоторые. У меня все еще есть index.js, и я могу найти другие файлы, на которые ссылается index.js.
Проблема в том, что когда я загрузил новые файлы на свой живой сайт, это полностью поломало мой плагин. Я сбросил постоянные ссылки из панели управления без успеха (пробую всё на данный момент). Если вы перейдете на эту страницу, попробуйте нажать на кнопки “Настроить и купить” или “Заказать образец”, и вы увидите, что ничего не происходит. Также они выглядят как обычные кнопки без моего css. https://www.areapublic.com/product/willows/
Это большая проблема для меня, и мне действительно нужно решить её как можно скорее. Я обновил все свои узлы, и этот плагин не зависит от других плагинов для работы. Он работал нормально с текущим списком плагинов. Сайт использует самую последнюю версию WordPress и все еще должен работать с самыми последними модулями, которые я обновил сегодня.
Пожалуйста, помогите!
Отредактировано, чтобы добавить:
У меня есть следующие строки кода для загрузки моих файлов сборки на сайте:
wp_enqueue_script('area-public-visualizer', plugin_dir_url(__FILE__) . 'build/index.js');
wp_enqueue_style('area-public-visualizer', plugin_dir_url(__FILE__) . 'build/index.css');
Хотя у меня все еще есть мой index.js, как уже упоминалось, у меня больше нет моего index.css и я больше не чувствую, что могу полагаться на команду wp-scripts build, чтобы она не изменила имя моих css файлов в будущем.
На самом деле, я только что разобрался с этим. У меня был мой src/index.js, который ждал, пока событие загрузки контента DOM сработает. Он работал на предыдущих версиях, но, по какой-то причине, обновление, которое произошло с тех пор, как я его впервые собрал, больше не нравится этому. Мне пришлось убрать слушатель событий с объекта окна. Это заставило его работать как нужно.
Ответ или решение
Решение проблемы с файлами в директории сборки вашего плагина
Ваша проблема, связанная с недоступностью файлов в директории build после выполнения команды wp-scripts build, может быть вызвана несколькими факторами. Давайте разберем ключевые моменты вашего обращения и предоставим комплексное решение.
Проблема
Вы заметили, что вместо ожидаемых файлов (например, index.js, index.css), у вас теперь появляются произвольные имена файлов (например, 134.js, 134.css). Это может быть связано с изменениями в процессе сборки, которые влияют на именование выходных файлов. Учитывая, что ваша плагина использует последние версии Node и WordPress, а также выполняет коды для подключения файлов:
wp_enqueue_script('area-public-visualizer', plugin_dir_url(__FILE__) . 'build/index.js');
wp_enqueue_style('area-public-visualizer', plugin_dir_url(__FILE__) . 'build/index.css');Важные моменты
-
Генерация имен файлов: В новых версиях
wp-scriptsможет использоваться хеширование для имен файлов. Это позволяет кэшировать версии файлов, но может повлиять на то, как вы их подключаете. -
Подключение стилей и скриптов: Убедитесь, что имена файлов, которые вы подключаете через
wp_enqueue_scriptиwp_enqueue_style, соответствуют последней сборке, которую вы получили. -
Проблемы с загрузкой DOM: Вы упомянули, что решили проблему, убрав слушателя события
DOMContentLoaded. Это может также указывать на изменения в вашей системе, так как ранее код работал. Убедитесь, что ваш JavaScript код вызывает необходимые функции после полной загрузки страницы, если это нужно.
Рекомендации для решения
-
Проверьте процесс сборки: Убедитесь, что ваш
webpack.config.jsили аналогичный конфигурационный файл корректно настроен. Проверьте, включено ли использованиеoutput.filenameс хешами для файлов. -
Используйте возможности WordPress: Вместо вручную прописанных путей к
index.jsиindex.css, рассмотрите возможность использования динамического получения файлов в соответствии с их актуальными именами. Это можно сделать с помощью других хуков, которые могут хранить информацию о версиях файлов (например,plugin_dir_url( __FILE__ )). -
Кэширование: Если у вас есть кэширование на стороне сервера или в браузере, не забудьте его сбросить после загрузки новых файлов. Кэширование может привести к загрузке старых версий файлов.
-
Отладка: Включите режим отладки в WordPress, чтобы проверить наличие возможных ошибок при загрузке скриптов и стилей. Это поможет выявить, что именно не так с вашими файлами.
-
Проверка консоли браузера: Откройте инструменты разработчика в вашем браузере и проверьте вкладку консоли на наличие ошибок JavaScript. Это может дать подсказки о причинах некорректной работы кнопок.
Заключение
Проблемы с загрузкой файлов в директории build могут быть вызваны множеством факторов, включая изменения в процессе сборки плагина и его зависимости. Тщательное расследование и следование приведенным выше рекомендациям должны помочь вам восстановить функциональность вашего плагина и избежать подобных проблем в будущем. Если вы столкнетесь с дополнительными вопросами или проблемами, не стесняйтесь обращаться за помощью к сообществу или к профессионалам в области разработки плагинов для WordPress.