drupal-javascript

Implement Drupal JavaScript patterns including behaviors, libraries.yml, attach_library, and Ajax commands for modules/themes.

67|13|Updated Apr 15, 2026
One-click install
npx skills add https://github.com/edutrul/drupal-ai --skill drupal-javascript
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: drupal-javascript
Source: https://github.com/edutrul/drupal-ai/tree/main/.claude/skills/drupal-javascript
Command: npx skills add https://github.com/edutrul/drupal-ai --skill drupal-javascript

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps Drupal developers implement client-side logic in a consistent, reusable way by standardizing on Drupal.behaviors, drupalSettings, and library attachments, reducing boilerplate and errors.

Core Features & Use Cases

  • Drupal Behaviors pattern ensures safe, context-aware initialization across page loads.
  • Library management via .libraries.yml and attach_library() to load JS/CSS.
  • Drupal settings via drupalSettings to pass server-side data to JavaScript, and creating custom Ajax commands.

Quick Start

Create a Drupal.behaviors.myBehavior that initializes on page load and attaches a library via attach_library(), while reading configuration from drupalSettings.

Frequently Asked Questions about drupal-javascript

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I use Drupal behaviors to initialize JavaScript safely across page loads?

To pass server-side data to client-side JavaScript in Drupal, use the drupalSettings object. You populate drupalSettings within PHP and access the variables directly in your JavaScript behavior, ensuring secure data transfer to the frontend.

What is the best way to attach JavaScript libraries in a Drupal Twig template?

Yes, you can create custom Ajax commands in Drupal to execute specific client-side logic. By defining a custom Ajax command and returning it from your PHP controller, your Drupal JavaScript behavior can intercept and process the custom command response.

When do I need to define a libraries.yml file for a Drupal module?

Yes, drupalSettings works seamlessly with the Drupal behaviors pattern. Your JavaScript behavior reads configuration values directly from the drupalSettings object during the attach phase, allowing you to pass dynamic server-side parameters to client-side logic.

Why does my Drupal JavaScript code run multiple times after an Ajax request?

To attach JavaScript libraries conditionally in Drupal, use the '#attached' property in your PHP render array or call attach_library() within a Twig template. This ensures assets are only loaded when the specific component or template is rendered.