We need to have a new topic written that covers:
- How to define a library of CSS/JS files
- How to add a library to a page, in conjunction with output you are creating in a page controller, block, or theme implementation

Comments

webchick’s picture

webchick
she/they
Primary language English
Location Vancouver 🇨🇦
commented

IIRC there are at least 4 ways to do this:

1) Adding a quick bit of CSS/jS that's custom to your module on one particular page inline.
2) Adding one or more CSS/JS files together as a "library" and declaring it as such in your module.libraries.yml file, then using it later in your module.
3) Adding an external CSS/JS library from some URL somewhere as a library
4) Adding run-time JS "settings" to a library.

I'm not sure which of these should be in the API topic page and which should be linked to in the full docs at https://www.drupal.org/node/2274843. I guess we should grep and see what are the most common "80% cases."

Here are some resources I know about, though I can't attest to how up to date they all are:

- https://www.drupal.org/node/2228783
- https://www.drupal.org/node/2274843
- http://highrockmedia.com/blog/drupal-8-attaching-core-libraries-and-othe...
- https://www.drupal.org/node/2298551 < somewhat inconclusive.

webchick’s picture

webchick
she/they
Primary language English
Location Vancouver 🇨🇦
commented
Status: Active » Closed (duplicate)

Oops. I missed that Jennifer had already created #2301851: Make sure module developers have info on adding js/css to pages which covers the same ground and has a better issue summary. Closing this as a duplicate.