Drupal Radix Theme
  • Introduction
    • Overview & Support
  • Installation
    • Requirements
    • Getting Started
    • Setup with ddev
  • Understanding Radix
    • Individual files and directories
    • Bootstrap Build
    • Bootswatch
  • Working with the components
    • Components: Intro
    • Components: A deep dive
    • An example component
    • The drupal-radix-cli
    • Copy and modify a component
  • Components
    • Accordion
    • Alerts
    • Badge
    • Block
    • Buttons
    • Button Group
    • Breadcrumb
    • Card
    • Carousel
    • Close button
    • Comment
    • Collapse
    • Details
    • Dropdown menu
    • Field
    • Field Comment
    • Fieldset
    • Figure
    • Form
    • Form: Element
    • Form Element Label
    • Form Element: Radio Checkbox
    • Heading
    • HTML
    • Image
    • Input
    • List group
    • Local Tasks
    • Media
    • Modal
    • Nav
    • Nav Item
    • Navbar
    • Navbar Brand
    • Node
    • Offcanvas
    • Page
    • Page: Content
    • Page: Footer
    • Page: Navigation
    • Page: Title
    • Pagination
    • Progress
    • Radios
    • Region
    • Select
    • Spinners
    • Table
    • Taxonomy
    • Textarea
    • Toasts
    • Tooltips
    • User
    • Views: view
    • Views: view--grid
    • Views: view--table
    • Views: view--unformatted
  • Misc
    • Migration and upgrading
    • Roadmap
    • Credits & Contributions
Powered by GitBook
On this page
  • Features
  • Installation
  • Usage
  • Help

Was this helpful?

  1. Working with the components

The drupal-radix-cli

The helper npm package to maintain your Radix components

PreviousAn example componentNextCopy and modify a component

Last updated 1 year ago

Was this helpful?

Now that we learned how a component works in a theme in Drupal, let's make our lives easier with a handy little npm package called: drupal-radix-cli

You can check the GitHub repository to learn more about it but in short, Radix Drupal CLI is an interactive prompt designed to manage Drupal Radix 6 components. It allows for easy listing, adding and generating of components to your Drupal theme, leveraging the power of the Radix base theme components.

Note: that this CLI uses your own local Radix theme as a source for components. If you want to add components from the latest version of Radix, you must first update your local Radix theme.

Features

  • List Components: Display all available Radix components.

  • Add Components: Add Radix components to your theme, automatically replacing any existing ones.

  • Generate Components: Generate a new component folder with all the necessary files.

Installation

Ensure you have Node.js and npm installed on your system. Install the CLI tool within your subtheme or globally via npm:

npm install drupal-radix-cli

Note: You may also install the package globally: npm install -g drupal-radix-cli

Usage

Once installed, you can use the CLI tool with the following commands:

List Components

To list all Radix components available in the default directory:

drupal-radix-cli list

Add Components

To add a Radix component to your current theme:

drupal-radix-cli add

Use the --radix-path flag to specify a custom Radix components directory if your Radix base theme is installed in a non-standard location:

drupal-radix-cli add --radix-path ../../radix/components

Generate Components

To generate a clean new component folder within your subtheme components directory:

drupal-radix-cli generate

This will generate a new component folder with the following files:

  • [component-name]/[component-name].twig

  • [component-name]/[component-name].component.yml

  • [component-name]/[component-name].scss

  • [component-name]/_[component-name].js

  • [component-name]/README.md

Make sure to remove any unwanted files and update your files accordingly.

Help

Display usage instructions:

drupal-radix-cli --help

Or simply drupal-radix-cli.

A demo of drupal-radix-cli in action