如何在Drupal 8主题中添加javascript库?

时间:2014-10-22 16:51:55

标签: javascript php drupal drupal-theming drupal-8

我试图在我正在构建的Drupal 8主题中包含一个自定义javascript文件来操作我的菜单。我按照Drupal 8主题指南中的说明进行操作,包括在我的.info.yml文件中:

#js libraries
libraries:
- dcf/base

并在我的.libraries.yml文件中定义它:

base:
version: 1.x
js:
    js/endscripts.js
dependencies:
    - core/drupal
    - core/underscore
    - core/backbone
    - core/jquery

最后使用钩子实现创建一个.theme文件(我不是真正的PHP开发人员,因此我主要从指南中的示例中做了一个复制/粘贴工作)

<?php

function dcf_page_alter(&$page) { 
  $page['#attached']['library'][] = 'dcf/base';
}

?>

我清除缓存,注销以查看未登录页面(管理视图中有很多额外的脚本和它调用的css文件)并查看源代码以查看我的脚本是否正在加载。我正在加载我库中列出的所有依赖项,但不是我的脚本本身。

enter image description here

脚本本身只是一个基本测试,应该使用JQuery隐藏我的主菜单,放入严格的&#39;格式化主题指南是必需的。

(function () {
  "use strict";
  // Custom javascript
  $(document).ready(function() {
    $("#block-dcf-main-menu").hide();
  });
})();

此刻我不知所措。我的直觉是错误在我的钩子实现中,因为我真的不了解Drupal的钩子系统,但据我所知,它仍然可能只是他们还没有完成为Drupal 8实现了这一点(我这样做是为了测试我的组织即将进行的网站重建Drupal 8,目前我正在运行Drupal 8.0.x-beta2而没有安装额外的模块)

2 个答案:

答案 0 :(得分:1)

这就是我做的方式

<强> my_theme.info

没有图书馆声明

<强> my_theme.libraries.yml

my_theme:
  version: 1.0
  css:
    theme:
      css/my_theme.css: {}
  js:
    js/my_theme.js: {}
  dependencies:
    - core/jquery
    - core/drupal
    - core/drupalSettings

<强> my_theme.theme

/*
*
*    see doc to attach library more specifically
*
* */
function my_theme_page_attachments_alter(array &$attachments) {
    $attachments['#attached']['library'][] = 'my_theme/my_theme';    
}

<强> /js/my_theme.js

 console.log('it works!');

<强> /css/my_theme.css

 /*smthg radical happens*/
 body{
   display:none;
 }

答案 1 :(得分:0)

答案,就像clive的评论一样,脚本末尾缺少{}。所以mytheme.libraries.yml中的脚本声明应该是
    JS:         js / endscripts:{}