node package manager


This decorator allows to easily style Preact components through adding a scoped stylesheet inside that component and defined styles only get applied to it and its descendants.

Basically it allows to style in preact like Angular or Vue does by adding a scoped stylesheet



Getting started

install npm install stylesheet-decorator --save


  1. import
import { stylesheet } from "stylesheet-decorator"
  1. define a string with raw CSS content
const style = `
  span { font-size: 20px }
  1. Plug it on render fn of some Preact component
render() {
  return <span>something</span>

That's all.

This decorator supports all CSS capabilities defined here:

This development is related on this conversation: Twitter Link and this issue GH preact issue