Добавление JS в тему Drupal 8 (замена для drupal add js)
В Drupal 7 я могу использовать drupal_add_js
в рамках темы template.php файл как функция theme_preprocess_html(&$vars)
:
drupal_add_js(drupal_get_path('theme', 'mytheme') . '/js/scripts.js',
array(
'group' => JS_THEME,
'preprocess' => TRUE,
'weight' => '999',
));
$vars['scripts'] = drupal_get_js();
В Drupal 8 я попытался преобразовать это с помощью attached
в файле моей темы .тема как таковая:
$vars['#attached']['js'] = array(
array(
'data' => drupal_get_path('theme', 'mytheme') . '/js/scripts.js',
'options' => array(
'group' => JS_THEME,
'preprocess' => TRUE,
'every_page' => TRUE,
),
),
);
... но это не сработало, и не было никаких ошибок в сторожевом псе/консоли или в чем-либо другом.
В соответствии с страницей API D8 для drupal_add_js
:
Устарело - с версии Drupal 8.0. Используйте ключ #прикрепленный в рендеринге вместо этого массивы.
Однако информации об этом было не намного больше. Похоже, что drupal_add_css
также будет использовать этот метод. Я знаю, что для Drupal 8 еще рано, но я надеялся, что это поможет мне продвинуться вперед.
5 answers
Кажется, вы можете использовать hook_preprocess_page
с прикрепленным как таковым:
function MYTHEME_preprocess_page(&$vars, $hook) {
$path = drupal_get_path('theme', 'MYTHEME');
// Render the main scripts file.
$local_js = array(
'#attached' => array(
'js' => array(
$path . '/js/scripts.js' => array(
'group' => JS_THEME,
'weight' => 9999),
),
),
);
\Drupal::service('renderer')->renderRoot($local_js);
}
Это отлично работает (тема.inc использует этот метод), обратите внимание на дополнительный вложенный массив вокруг веса.
Ключевым моментом в документации является этот бит
Вместо этого используйте #прикрепленный ключ в массивах визуализации.
Акцент мой.
Массив $variables
в функции темы/предварительной обработки не является массивом визуализации, это просто массив, содержащий переменные. Чтобы использовать #attached
, вам понадобится что-то вроде этого в функции предварительной обработки:
$vars['foo'] = array(
'#markup' => '<p>Bar</p>',
'#attached' => array(
'data' => drupal_get_path('theme', 'mytheme') . '/js/scripts.js',
'options' => array(
'group' => JS_THEME,
'preprocess' => TRUE,
'every_page' => TRUE,
),
),
);
И это в файле шаблона:
{ foo }
Другими словами, более или менее то же самое, что и в Drupal 7 (на данный момент по крайней мере, со временем).
hook_preprocess_html()
кстати, скорее всего, это неподходящее место для этого кода; не забывайте, что файлы js/css фактически отображаются в этом шаблоне, так что уже слишком поздно добавлять что-либо еще hook_preprocess_page()
, hook_preprocess_node()
или эквивалент, вероятно, даст вам более надежные результаты.
Смотрите страницу Рекомендации Twig - функции и шаблоны предварительной обработки для получения дополнительной информации о переменных предварительной обработки.
Начиная с Drupal 8.0.x-beta2, вы можете прикреплять CSS и JS из функций предварительной обработки.
В этом примере вы используете реальный массив визуализации, а не тот, который отображается в самой функции.
Таким образом, другие модули, темы и т.д. могут изменить его.
/**
* Implements hook_page_alter().
*/
function db_jacket_page_alter(&$page) {
$page['#attached']['js'][] = drupal_get_path('theme', 'db_jacket') . '/js/jquery.image-depth.js';
}
Хотя ОП касается Drupal 8, это можно было бы сделать аналогичным образом в Drupal 7 без использования drupal_add_js()
, чтобы начать привыкать к отсутствию drupal_add_js()
рядом:
/**
* Implements hook_preprocess_page().
*/
function YOURMODULE_preprocess_page(&$variables) {
$module_path = drupal_get_path('module', 'YOURMODULE');
$variables['page']['content']['#attached']['js'][$module_path . '/js/YOURMODULE.js'] = array();
}
Параметры могут быть определены в пустом массиве, см. https://api.drupal.org/api/drupal/includes%21common.inc/function/drupal_add_js/7.