如何在 Drupal 8 主题中添加 javascript 库？答案

【问题标题】：How to add javascript library in Drupal 8 theme?如何在 Drupal 8 主题中添加 javascript 库？
【发布时间】：2014-10-22 16:51:54
【问题描述】：

我正在尝试在我正在构建的 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 文件）并查看源代码以查看我的脚本是否正在加载。我在库中列出的所有依赖项都在加载，但不是我的脚本本身。

脚本本身只是一个基本测试，应该使用 JQuery 隐藏我的主菜单，放入主题指南提到的“严格”格式。

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

我在这一点上不知所措。我的直觉是错误出在我的钩子实现中，因为我真的不了解 Drupal 的钩子系统，但据我所知，仍然可能只是他们还没有完成对 Drupal 8 的实现（我'我这样做是为了测试 Drupal 8 为我的组织即将重建的网站，并且目前正在运行 Drupal 8.0.x-beta2，没有安装其他模块）

【问题讨论】：

远射，但请尝试将 js/endscripts.js 更改为 js/endscripts.js: {} 并清除缓存。您也不需要在 THEME.info.yml 文件中引用该库并将其附加到更改挂钩中，一个就足够了
做到了。不知道为什么，但现在脚本出现了。如果您想对此效果添加答案，我会回来接受它。
@whiplashomega 我正在尝试在 Drupal 8 中为自定义模块中的小部件做同样的事情。你能帮我吗？向我指出任何资源或您开发的项目？谢谢
@Sach 你可以看到drupal.org/developing/api/8/assets

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

【解决方案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;
 }

【讨论】：

不要忘记清空缓存或停用它

【解决方案2】：

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

【讨论】：