Как подключить необходимые JS-модули на отдельных страницах (CMS Wordpress)?

Question

[thirteen_bit]

Возможно ли добиться такой организации кода, где для каждой страницы подгружаются свои модули (реализую паттерн "Модуль" на js). К примеру, мне нужен модуль по работе с изображениями (объявленный в файле app/image.js) на странице www.site.com/images, но на остальных страницах в нем нет никакой необходимости. Имеется ли возможность указать в вордпрессе, что на одних страницах нужно подгружать один набор JS-модулей, а на других - другой.

Простите за столь сумбурную формулировку, могу дать уточнения при необходимости

Comments

[Денис Янчевский]

Информация для размышления: https://ru.stackoverflow.com/a/773199/274206

[Алексей]

посмотрите на https://roots.io/ в плане организации кода и процесса разработки.
в частности в их стартовой теме из коробки есть DOM-based Routing, Based on goo.gl/EUTi53 by Paul Irish. скрипты подключаются в зависимости от наличия определеннго класса в тэге body

Answer 1

[Антон Дробышев]

Да. Делаем проверку is_page() или подобное и подключаем нужный скрипт.

Answer 2

[profesor08]

Запакуй все скрипты вордпреса и свои в один файл, минифицируй и сожми. Подключи в конце документа и радуйся улучшившейся производительности. Тем самым твои скрипты загрузятся один раз и будут доступны из кеша браузера. И при переходе на другие страницы, ничего дополнительного загружать не придется.

Answer 3

[Андрей Бердов]

1) Регистрируем скрипт в файле functions.php темы:

add_action('init', 'framework_register_scripts');
function framework_register_scripts() {
    wp_register_script('printcoupon', get_template_directory_uri() . '/js/printcoupon.js', array('jquery'), '1.0.0', true);
}

2) вызываем скрипт, где нужно (в функции вывода, шаблоне страницы и т.п.):
wp_enqueue_script( 'printcoupon' );

Answer 4

[Алексей Алексеев]

1 вариант (через wp):
Js скрипты можно подключать через стандартную функцию wp_enqueue_script (https://wp-kama.ru/function/wp_enqueue_script #4 пример про подключение по условию), кроме указания условий подключений можно указать зависимости, которые так же нужно подключить и, насколько я помню, минифицирует скрипты (но это не точно).
2 вариант (через главный js, который подключается на все страницы):
В js файлы можно подгружать по условию через сам js: проверяется условие подключения (наличие необходимого тега или нужный url) и добавляется тэг script с необходимым url. Лучше использовать сторонними библиотеками для корректного подключения, а еще лучше организовать сборку js через webpack и загрузку модулей через require.ensure.