Eleventy Assets

Overview

Eleventy Assets is a utility designed for managing assets in your Eleventy projects. Although it’s been retired and replaced by the Eleventy Bundle Plugin, this npm package can still provide valuable functionalities for those looking to enhance their site’s asset management. With a focus on generating and inlining code-split CSS specifically tailored for individual pages, Eleventy Assets offers a straightforward implementation without the need for complex plugin setups.

This tool is particularly beneficial for developers working on Eleventy projects who want to efficiently manage their CSS assets. With its compatibility for standalone use or in conjunction with other Eleventy plugins, it provides flexibility and ease of integration.

Features

• Code-Split CSS Generation: Automatically generates and inlines CSS specific to the pages in your project, optimizing loading times and resource management.
• Standalone Implementation: Can be used independently or paired with other Eleventy plugins, providing versatility in how you manage project assets.
• Usage Logging: Includes a component shortcode that helps you log component usage within your templates, offering insights into your project’s structure.
• CSS Output Filter: Features a getCSS filter that outputs the code-split CSS relevant to the current URL, ensuring each page only loads necessary styles.
• Sample Directory Provided: Comes with a sample directory that illustrates example implementations, making it easier for developers to understand and utilize the package.
• Component CSS Organization: Stores component-specific CSS neatly in the designated ./sample/css/ directory, promoting organized asset management.