Eleventy WebC v0.11.2

Milestone: https://github.com/11ty/eleventy-plugin-webc/milestone/12?closed=1
Full Changelog: v0.11.1...v0.11.2

• Fix for Eleventy import to allow this plugin to be compatible with both ESM and CJS projects in Eleventy v3.0. #91

Eleventy WebC v0.11.1

Milestone: https://github.com/11ty/eleventy-plugin-webc/milestone/11?closed=1
Full Changelog: v0.11.0...v0.11.1

• #76 Add support for Eleventy provided getPreviousCollectionItem and getNextCollectionItem filters in WebC
• #71 Add access to helpers in callbacks when using WebC as a postprocessing transform (e.g. https://www.11ty.dev/docs/languages/webc/#post-process-html-output-as-webc)

Eleventy WebC v0.11.0

Milestone: https://github.com/11ty/eleventy-plugin-webc/milestone/10?closed=1
Full Changelog: v0.10.1...v0.11.0

• Upgrades to WebC v0.11.0, release notes or read more below.
• Scopes top-level css, js, and html helpers (via https://github.com/11ty/eleventy-plugin-bundle) to webc.helpers.* This technically is a breaking change but these helpers were undocumented with WebC so it’s unlikely folks were using them directly. #65 #66

WebC v0.11.0

⚠️ BREAKING ⚠️ This will affect your component code if you relied on global data from inside of component definitions.

Child components will now need to access global data through a top level $data variable instead of as top level variables. This is important to prevent global data leaking into component data and affecting component logic.

This will not affect pages or top-level WebC components (in Eleventy world, these are *.webc files as Eleventy layouts or in as pages in your input folder). This only affects child components (in Eleventy world, this means files in your components folder, e.g. _components/**/*.webc).

• Read more at 11ty/webc#151.
• Here’s the commit that was required to upgrade 11ty.dev to WebC v0.11.0.

Sorry to have to make this breaking change, but it’s an important one.

Other fixes in this release:

• Fix for webc:scoped with @keyframes and percentages. 11ty/webc#145
• Fix bug with webc:setup feeding Arrays into webc:for 11ty/webc#150

Eleventy WebC v0.10.0: Declarative Loops and Flow Control

Upgrades to WebC v0.10.0: more context on the full WebC Release Notes

• webc:for for looping https://www.11ty.dev/docs/languages/webc/#webcfor-loops
• webc:elseif and webc:else https://www.11ty.dev/docs/languages/webc/#webcelseif-and-webcelse
• Server-only HTML comments <!--- One more dash at the start and end ---> https://www.11ty.dev/docs/languages/webc/#server-only-comments
• <script webc:type="js"> (via implied webc:is="template") will be treated as HTML-only components and not use the host component tags (via implied webc:nokeep).
• Relax circular dependency errors: instead of throwing an error, we now treat this as a plain HTML tag instead of a WebC component. This makes it easier to override HTML tags (e.g. img.webc returning an <img> without needing using webc:root="override").
• ⚠️ BREAKING (but low-impact): void elements (self-closing elements without a closing tag) used as components will be ignored in output when the component has child content. (e.g. img.webc returning an <img> without needing to use webc:root="override")

Full Changelog: v0.9.4...v0.10.0

Eleventy WebC v0.9.4: 65% Faster

What's Changed

• Using WebC v0.9.3 Release Notes
  • 65% faster!!
  • Added a WebC component cache
  • Shamefully large performance wins via changes to Node vm.createContext

A special thanks to @marvinhagemeister’s Node profiling recommendation!

How fast is it?

From a large sample WebC project:

Before, using WebC v0.9.2:
> Wrote 2621 files in 21.17 seconds (8.1ms each, v2.0.0)

After, using WebC v0.9.3:
> Wrote 2621 files in 7.24 seconds (2.8ms each, v2.0.0)

From 8.1ms per template to 2.8ms per template!

Full Changelog: v0.9.3...v0.9.4

Eleventy WebC v0.9.3: Bundle plugin options

• Adds support for bundlePluginOptions plugin options object passed to @11ty/eleventy-plugin-bundle. Full options list documented on https://github.com/11ty/eleventy-plugin-bundle#installation
  • Enables bundle hoisting in the bundle plugin 11ty/eleventy-plugin-bundle#5

Full Changelog: v0.9.2...v0.9.3

Eleventy WebC v0.9.2: Asset Bucketing, Anywhere

• Adds support for an Array (of files or globs) to be passed in via the components option.
• Adds support for npm: prefixes in components option.

For example:

eleventyConfig.addPlugin(pluginWebc, {
	components: [
		"./_components/**/*.webc",
		"npm:@11ty/is-land/*.webc",
		"npm:@11ty/eleventy-plugin-syntaxhighlight/*.webc",
	],
});

Full Changelog: v0.9.1...v0.9.2

Using WebC v0.9.1

WebC v0.9.1 release notes:

• Adds support for webc:bucket on any tag and it will cascade to all child content (with automatic hoisting when necessary) 11ty/webc#122
• Adds support for webc:bucket to be dynamic (e.g. :webc:bucket="myJavaScriptData") 11ty/webc#120
• Adds support for globs when passing an Array to WebC.getComponentsMap() 11ty/webc#123
• Adds npm: aliasing support to WebC.getComponentsMap() 11ty/webc#123

Eleventy WebC v0.9.1: Asset bucketing fix

• Fix CSS and JS not getting bundled for non-default buckets by @Gyanreyer in #57 #56

Milestone: https://github.com/11ty/eleventy-plugin-webc/milestone/8?closed=1
Full Changelog: v0.9.0...v0.9.1

Eleventy WebC v0.9.0: `<script webc:setup>` and `@attributes`

Eleventy WebC v0.9.0

Docs have been updated on: https://www.11ty.dev/docs/languages/webc/

WebC v0.9.0

• Using WebC v0.9.0 which includes ⚠️ 2 medium risk and ✅ 2 low risk breaking changes.
  • Make sure you read the WebC v0.9.0 release notes!!
• WebC v0.9.0 features:
  • New <script webc:setup> feature to use arbitrary JavaScript to export data for use in the component
  • Support new shadowrootmode attribute to opt-out of asset bundling in Declarative Shadow DOM
  • New @attributes feature to render an attributes object
    • New webc.attributes object and webc.renderAttributes method for use in JavaScript Render Functions
  • New :@ prefix for dynamic properties (e.g. :@dynamic-property)
  • webc:ignore will completely ignore a node (no processing or output)
  • Support :host() and :host-context() pseudo classes in webc:scoped by @Gyanreyer in 11ty/webc#96

Eleventy WebC Plugin v0.9.0

• Now using the eleventy-plugin-bundle internally for WebC bundling #48 #46 #4
• Various fixes for permalink, including a better fallback case for raw (non-JS) strings #50 #47 #52
• Example code to populate front matter data using JavaScript (similar to webc:setup above) #45

---

WebC v0.9.0 Release Notes
Full Milestone: https://github.com/11ty/eleventy-plugin-webc/milestone/7?closed=1
Full Changelog: v0.8.1...v0.9.0

Eleventy WebC v0.8.0: Little Bundler of Joy

Breaking Changes

• Enables Bundler mode consistently for all WebC files (notably, this was not enabled for Eleventy Layout files previously). Read more at #33 and #11.
  • ACTION NEEDED 🚨 You will need to add webc:keep to any <style> or <script> tags in Eleventy Layout WebC files to prevent them from being re-bundled out of existence! (You can check out an example of a WebC file as an Eleventy Layout on the WebC docs)
  • This was important as it allows the use of WebC components in Eleventy Layout files and will bundle their assets as expected. Read more about WebC Bundler Mode
• From WebC v0.8.0: attribute-name properties and attributes are now available in data as camel-case: attribute-name in JS data is attributeName. Read more at @11ty/webc#71

WebC release notes:

• v0.8.0 https://github.com/11ty/webc/releases/tag/v0.8.0 (mostly fixes for webc:type="js")

Milestone: https://github.com/11ty/eleventy-plugin-webc/milestone/6?closed=1
Full Changelog: v0.7.0...v0.8.0