Eleventy Plugin Bundle

Overview

The Eleventy Plugin Bundle is a useful tool for developers looking to streamline their Eleventy projects. It allows for the creation of minimal CSS, JavaScript, or HTML bundles, making it easy to include only what is necessary for each page or application. This plugin is especially handy when implementing critical CSS or specific asset bundles, providing a simple solution without the overhead of a full-featured bundler.

What sets this plugin apart is its efficiency; it operates as a minimum-viable-bundler and asset pipeline without manipulating code by default. While it may not offer the extensive features of larger bundlers like Webpack or Parcel, it represents a lightweight solution that’s worth considering, particularly for those who need straightforward functionality without the performance costs associated with more complex tools.

Features

• Minimal Bundles: Create lightweight bundles for CSS, JavaScript, or HTML to ensure only necessary assets are loaded per page.
• No Installation Required: Comes pre-bundled with Eleventy v3.0.0-alpha.10 and newer, simplifying the setup process.
• Flexible Configuration: Easily add custom bundles via eleventyConfig.addBundle in your Eleventy configuration file.
• Universal Shortcodes: Provides shortcodes like getBundle and getBundleFileUrl for efficient retrieval and management of bundled code across various template formats.
• Critical CSS Support: Implement asset bucketing to improve page load performance by deferring non-essential CSS asynchronously.
• Output File Generation: Write bundled content to disk, which is better cached by browsers for returning visitors, enhancing performance on repeat views.
• Integration with Other Plugins: Works seamlessly with the WebC Eleventy Plugin, which can automatically add necessary bundles without additional configuration.