Sprockets::Components

Make web components easier to develop in Rails using Sprockets.

Installation

Just add gem "sprockets-components to your Gemfile.

Usage

Use one directory per component, under app/assets/components:

app/assets/
└── components
    └── my-counter
        ├── my-counter.js
        ├── my-counter.scss
        └── my-counter.slim

At the top of the main my-counter.js component file, add the component directive:

//= component

customElements.define("my-counter", class extends HTMLElement {
  // ...
})

This directive exposes an HTML variable for use in the component. It is a string of the compiled template, with the compiled CSS inlined into an interior