0

I am using Bootstrap 3 subtheme and Drupal 8. For some reason when I add the dependency core/jquery it does not work. What am I doing wrong?

mysubtheme:
  css:
    theme:
      css/slippry.css: {}
    header: true
    js:
      js/slippry.js: {}
  dependencies:
      - core/jquery

The only way I can get jquery to load is when I put the jquery.min.js URL into my page.html.twig file.

1

Yaml is heavily indentation oriented.

There are yaml validators like: YAMLlint. It will also the intendation for you. But not the wrongly set header option.

You have two indents (spaces) to much before the dash, plus js: needs to be upped too. Also the header property is set wrong, check the docs - if you want the js in the header, it needs its own library definition:

mysubtheme:
  css:
    theme:
      css/slippry.css: {}
  js:
    js/slippry.js: {}
  dependencies:
    - core/jquery

This will work ! (but is in the footer)

This is how the two library definitions will look like:

slippry-css:
  css:
    theme:
      css/slippry.css: {}

and

slippry-js:
  header: true
  js:
    js/slippry.js: {}
  dependencies:
    - core/jquery

You'll need then to add both libraries!

Maybe this will work too:

mysubtheme:
  header: true
  css:
    theme:
      css/slippry.css: {}
  js:
    js/slippry.js: {}
  dependencies:
    - core/jquery

To debug your libraries, use libraries_ui

| improve this answer | |
  • Thanks, but for some reason it still isn't working.. :( – Hert Niks May 5 '17 at 11:16
  • Sorry .. js: was also wrongly intended (see my edit). You need to rebuild the caches too ! – rémy May 5 '17 at 12:52
  • You should run it through a yaml linter - it will tell you if there are errors in spacing. – Kevin May 5 '17 at 13:33
  • I did use YAMLlint to do it but something is not right. This is the website: outdoorsfinland.fi/drupal – Hert Niks May 5 '17 at 14:02
  • Pls review my edited answer, you intended also js: and header: wrong – rémy May 5 '17 at 14:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.