@11ty/eleventy-plugin-webc 0.11.1 → 0.12.0-beta.2

package/eleventyWebcPlugin.js

@@ -1,35 +1,29 @@
-const eleventyBundlePlugin = require("@11ty/eleventy-plugin-bundle");
 const pkg = require("./package.json");
 const templatePlugin = require("./src/eleventyWebcTemplate.js");
 const transformPlugin = require("./src/eleventyWebcTransform.js");
 
 module.exports = function(eleventyConfig, options = {}) {
-	try {
-		eleventyConfig.versionCheck(pkg["11ty"].compatibility);
-	} catch(e) {
-		console.log( `WARN: Eleventy Plugin (${pkg.name}) Compatibility: ${e.message}` );
-	}
+	eleventyConfig.versionCheck(pkg["11ty"].compatibility);
+
+	// Error for removed filters.
+	eleventyConfig.addFilter("webcGetCss", () => {
+		throw new Error("webcGetCss was removed from @11ty/eleventy-plugin-webc. Use the `getBundle('css')` shortcode instead.")
+	});
+
+	// Error for removed filters.
+	eleventyConfig.addFilter("webcGetJs", () => {
+		throw new Error("webcGetJs was removed from @11ty/eleventy-plugin-webc. Use the `getBundle('js')` shortcode instead.")
+	})
 
-	// Deprecated: this lives in @11ty/eleventy-plugin-bundle now
-	let filters = Object.assign({
-		css: "webcGetCss",
-		js: "webcGetJs",
-	}, options.filters);
 
 	options = Object.assign({
 		components: "_components/**/*.webc", // glob for no-import global components
 		scopedHelpers: ["css", "js", "html"],
 		useTransform: false, // global transform
 		transformData: {}, // extra global data for transforms specifically
+		bundlePluginOptions: {},
 	}, options);
 
-	options.bundlePluginOptions = Object.assign({
-		hoistDuplicateBundlesFor: ["css", "js"]
-	}, options.bundlePluginOptions);
-
-	// Deprecated: this lives in @11ty/eleventy-plugin-bundle now
-	options.filters = filters;
-
 	if(options.components) {
 		let components = options.components;
 		if(!Array.isArray(components)) {
@@ -52,12 +46,15 @@ module.exports = function(eleventyConfig, options = {}) {
 		}
 	}
 
-	// TODO Remove this when @11ty/eleventy-plugin-bundle is moved to core.
-	// If the bundle plugin has not been added, we add it here:
-	let bundlePlugin = eleventyConfig.plugins.find(entry => entry.plugin.eleventyPackage === "@11ty/eleventy-plugin-bundle");
-	if(!bundlePlugin) {
-		eleventyConfig.addPlugin(eleventyBundlePlugin, options.bundlePluginOptions);
-	}
+	// v0.12.0 upstream `bundlePluginOptions.toFileDirectory` (via Bundle Plugin changes) default changed from "bundle" to ""
+	// https://github.com/11ty/eleventy-plugin-bundle/releases/tag/v2.0.0
+	let htmlBundleOptions = Object.assign({}, options.bundlePluginOptions, {
+		hoist: false, // don’t hoist
+	});
+
+	eleventyConfig.addBundle("html", htmlBundleOptions);
+	eleventyConfig.addBundle("css", options.bundlePluginOptions);
+	eleventyConfig.addBundle("js", options.bundlePluginOptions);
 
 	templatePlugin(eleventyConfig, options);
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@11ty/eleventy-plugin-webc",
-	"version": "0.11.1",
+	"version": "0.12.0-beta.2",
 	"description": "WebC support for Eleventy adds for Single File Web Components",
 	"main": "eleventyWebcPlugin.js",
 	"scripts": {
@@ -11,10 +11,10 @@
 	},
 	"license": "MIT",
 	"engines": {
-		"node": ">=14.18"
+		"node": ">= 18"
 	},
 	"11ty": {
-		"compatibility": ">=2.0.0"
+		"compatibility": ">=3.0.0"
 	},
 	"funding": {
 		"type": "opencollective",
@@ -26,28 +26,30 @@
 		"web-components",
 		"custom-elements"
 	],
-	"author": {
-		"name": "Zach Leatherman",
-		"email": "zachleatherman@gmail.com",
-		"url": "https://zachleat.com/"
+	"author": "Zach Leatherman <zachleatherman@gmail.com> (https://zachleat.com/)",
+	"repository": {
+		"type": "git",
+		"url": "git://github.com/11ty/eleventy-plugin-webc.git"
 	},
+	"bugs": "https://github.com/11ty/eleventy-plugin-webc/issues",
 	"ava": {
 		"failFast": true,
 		"files": [
-			"./test/test*.js"
+			"./test/test*.js",
+			"./test/test*.mjs"
 		],
-		"ignoredByWatcher": [
-			"**/_site/**",
-			".cache"
-		]
+		"watchMode": {
+			"ignoreChanges": [
+				"**/_site/**",
+				".cache"
+			]
+		}
 	},
 	"dependencies": {
-		"@11ty/eleventy-plugin-bundle": "^1.0.4",
-		"@11ty/webc": "^0.11.0"
+		"@11ty/webc": "^0.11"
 	},
 	"devDependencies": {
-		"@11ty/eleventy": "^2.0.0",
-		"ava": "^5.2.0",
-		"node-retrieve-globals": "^2.0.8"
+		"@11ty/eleventy": "^3.0.0",
+		"ava": "^6.2.0"
 	}
 }

package/src/eleventyWebcTemplate.js

@@ -1,9 +1,6 @@
 const path = require("path");
 const debug = require("debug")("Eleventy:WebC");
 
-const { EleventyRenderPlugin } = require("@11ty/eleventy");
-const CompileString = EleventyRenderPlugin.String;
-
 function relativePath(inputPath, newGlob) {
 	// project root
 	if(newGlob.startsWith("~/")) {
@@ -57,20 +54,6 @@ module.exports = function(eleventyConfig, options = {}) {
     templateConfig = cfg;
   });
 
-	// Deprecated (backwards compat only): this lives in @11ty/eleventy-plugin-bundle now
-	if(options.filters.css) {
-		eleventyConfig.addFilter(options.filters.css, (url, bucket) => {
-			return eleventyConfig.javascriptFunctions.getBundle("css", bucket);
-		});
-	}
-
-	// Deprecated (backwards compat only): this lives in @11ty/eleventy-plugin-bundle now
-	if(options.filters.js) {
-		eleventyConfig.addFilter(options.filters.js, (url, bucket) => {
-			return eleventyConfig.javascriptFunctions.getBundle("js", bucket)
-		});
-	}
-
 	eleventyConfig.addExtension("webc", {
 		outputFileExtension: "html",
 
@@ -84,7 +67,8 @@ module.exports = function(eleventyConfig, options = {}) {
 								...this,
 								...data,
 							}, `Check the permalink for ${inputPath}`, "eleventyWebcPermalink:" + inputPath);
-							return evaluatedString;
+
+							return evaluatedString.returns;
 						} catch(e) {
 							debug("Error evaluating dynamic permalink, returning raw string contents instead: %o\n%O", contents, e);
 							return contents;
@@ -108,15 +92,18 @@ module.exports = function(eleventyConfig, options = {}) {
 			}
 
 			// Support both casings (I prefer getCss, but yeah)
-			page.setHelper("getCss", (url, bucket) => this.config.javascriptFunctions.getBundle("css", bucket), scopedHelpers.has("getCss"));
-			page.setHelper("getCSS", (url, bucket) => this.config.javascriptFunctions.getBundle("css", bucket), scopedHelpers.has("getCSS"));
+			page.setHelper("getCss", (url, bucket) => this.config.javascriptFunctions.getBundle("css", bucket, url), scopedHelpers.has("getCss"));
+			page.setHelper("getCSS", (url, bucket) => this.config.javascriptFunctions.getBundle("css", bucket, url), scopedHelpers.has("getCSS"));
 
-			page.setHelper("getJs", (url, bucket) => this.config.javascriptFunctions.getBundle("js", bucket), scopedHelpers.has("getJs"));
-			page.setHelper("getJS", (url, bucket) => this.config.javascriptFunctions.getBundle("js", bucket), scopedHelpers.has("getJS"));
+			page.setHelper("getJs", (url, bucket) => this.config.javascriptFunctions.getBundle("js", bucket, url), scopedHelpers.has("getJs"));
+			page.setHelper("getJS", (url, bucket) => this.config.javascriptFunctions.getBundle("js", bucket, url), scopedHelpers.has("getJS"));
 
 			page.setTransform("11ty", async function(content) {
 				let syntax = this["11ty:type"];
 				if(syntax) {
+					const { RenderPlugin } = await import("@11ty/eleventy");
+					const CompileString = RenderPlugin.String;
+
 					let fn = await CompileString(content, syntax, {
 						templateConfig
 					});
@@ -129,6 +116,7 @@ module.exports = function(eleventyConfig, options = {}) {
 			return async (data) => {
 				// Add Eleventy JavaScript Functions as WebC helpers
 				// Note that Universal Filters and Shortcodes populate into javascriptFunctions and will be present here
+
 				for(let helperName in this.config.javascriptFunctions) {
 					let helperFunction = addContextToJavaScriptFunction(data, this.config.javascriptFunctions[helperName]);
 					page.setHelper(helperName, helperFunction, scopedHelpers.has(helperName));