Stencil 4 is here! Read all about what’s new in latest major release Read the Blog → Build. Customize. Distribute. Adopt. Stencil is a library for building reusable, scalable component libraries. Generate …

Component Decorator @Component() is a decorator that designates a TypeScript class as a Stencil component. Every Stencil component gets transformed into a web component at build time.

Stencil can be used to create standalone components, or entire apps. create-stencil, will provide a prompt so that you can choose the type of project to start:

Framework Integration Framework Integration Stencil's primary goal is to remove the need for components to be written using a specific framework's API. It accomplishes this by using …

Overview Stencil: A Web Components Compiler Stencil is a compiler that generates Web Components (more specifically, Custom Elements). Stencil combines the best concepts of the most popular …

Serialization & Deserialization Custom elements interact with the DOM either via HTML attributes (always strings) or JavaScript properties. Stencil automatically tries to keep properties and attributes …

React Integration Supports: React v17+ • TypeScript v5+ • Stencil v4.2.0+ Automate the creation of React component wrappers for your Stencil web components. This package includes an output …

Using Storybook with Stencil Storybook is a powerful tool for developing, testing, and documenting UI components in isolation. It's open-source, widely adopted, and integrates seamlessly with modern …

Stencil Core CLI API Stencil Core CLI API The CLI API can be found at @stencil/core/cli and ran by bin/stencil. createNodeLogger ()

Distributing Web Components Built with Stencil How is this different from "dist-custom-elements" output target? To start, Stencil was designed to lazy-load itself only when the component was actually used …