upgrade to 11ty 3.0

_data/metadata.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
 	title: "Musings",
 	url: "https://saji.dev/",
 	language: "en",

content/blog/blog.11tydata.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
 	tags: [
 		"posts"
 	],

content/feed/feed.11tydata.js

@@ -1,3 +1,3 @@
-module.exports = {
+export default {
 	eleventyExcludeFromCollections: true
 }

eleventy.config.drafts.js

@@ -1,4 +1,4 @@
-function eleventyComputedPermalink() {
+export function eleventyComputedPermalink() {
 	// When using `addGlobalData` and you *want* to return a function, you must nest functions like this.
 	// `addGlobalData` acts like a global data file and runs the top level function it receives.
 	return (data) => {
@@ -11,7 +11,7 @@ function eleventyComputedPermalink() {
 	}
 };
 
-function eleventyComputedExcludeFromCollections() {
+export function eleventyComputedExcludeFromCollections() {
 	// When using `addGlobalData` and you *want* to return a function, you must nest functions like this.
 	// `addGlobalData` acts like a global data file and runs the top level function it receives.
 	return (data) => {
@@ -24,10 +24,7 @@ function eleventyComputedExcludeFromCollections() {
 	}
 };
 
-module.exports.eleventyComputedPermalink = eleventyComputedPermalink;
-module.exports.eleventyComputedExcludeFromCollections = eleventyComputedExcludeFromCollections;
-
-module.exports = eleventyConfig => {
+export default function (eleventyConfig) {
 	eleventyConfig.addGlobalData("eleventyComputed.permalink", eleventyComputedPermalink);
 	eleventyConfig.addGlobalData("eleventyComputed.eleventyExcludeFromCollections", eleventyComputedExcludeFromCollections);
 

eleventy.config.images.js

@@ -1,5 +1,5 @@
-const path = require("path");
-const eleventyImage = require("@11ty/eleventy-img");
+import path from "path";
+import EleventyImage from "@11ty/eleventy-img";
 
 function relativeToInputPath(inputPath, relativeFilePath) {
 	let split = inputPath.split("/");
@@ -18,7 +18,7 @@ function isFullUrl(url) {
 	}
 }
 
-module.exports = function(eleventyConfig) {
+export default function(eleventyConfig) {
 	// Eleventy Image shortcode
 	// https://www.11ty.dev/docs/plugins/image/
 	eleventyConfig.addAsyncShortcode("image", async function imageShortcode(src, alt, widths, sizes) {
@@ -31,7 +31,7 @@ module.exports = function(eleventyConfig) {
 			input = relativeToInputPath(this.page.inputPath, src);
 		}
 
-		let metadata = await eleventyImage(input, {
+		let metadata = await EleventyImage(input, {
 			widths: widths || ["auto"],
 			formats,
 			outputDir: path.join(eleventyConfig.dir.output, "img"), // Advanced usage note: `eleventyConfig.dir` works here because we’re using addPlugin.
@@ -45,6 +45,6 @@ module.exports = function(eleventyConfig) {
 			decoding: "async",
 		};
 
-		return eleventyImage.generateHTML(metadata, imageAttributes);
+		return EleventyImage.generateHTML(metadata, imageAttributes);
 	});
 };

eleventy.config.js

@@ -1,17 +1,19 @@
-const { DateTime } = require("luxon");
-const markdownItAnchor = require("markdown-it-anchor");
+import { DateTime } from "luxon";
+import markdownItAnchor from "markdown-it-anchor";
 
-const pluginRss = require("@11ty/eleventy-plugin-rss");
-const pluginSyntaxHighlight = require("@11ty/eleventy-plugin-syntaxhighlight");
-const pluginBundle = require("@11ty/eleventy-plugin-bundle");
-const pluginNavigation = require("@11ty/eleventy-navigation");
-const { EleventyHtmlBasePlugin } = require("@11ty/eleventy");
+import pluginRss from "@11ty/eleventy-plugin-rss";
+import pluginSyntaxHighlight from "@11ty/eleventy-plugin-syntaxhighlight";
+import pluginBundle from "@11ty/eleventy-plugin-bundle";
+import pluginNavigation from "@11ty/eleventy-navigation";
 
-const pluginDrafts = require("./eleventy.config.drafts.js");
-const pluginImages = require("./eleventy.config.images.js");
+import { EleventyHtmlBasePlugin } from "@11ty/eleventy";
+
+
+import pluginDrafts from "./eleventy.config.drafts.js";
+import pluginImages from "./eleventy.config.images.js";
 
 /** @param {import('@11ty/eleventy').UserConfig} eleventyConfig */
-module.exports = function(eleventyConfig) {
+export default function (eleventyConfig) {
 	// Copy the contents of the `public` folder to the output folder
 	// For example, `./public/css/` ends up in `_site/css/`
 	eleventyConfig.addPassthroughCopy({
@@ -38,6 +40,7 @@ module.exports = function(eleventyConfig) {
 	eleventyConfig.addPlugin(EleventyHtmlBasePlugin);
 	eleventyConfig.addPlugin(pluginBundle);
 
+
 	// Filters
 	eleventyConfig.addFilter("readableDate", (dateObj, format, zone) => {
 		// Formatting tokens for Luxon: https://moment.github.io/luxon/#/formatting?id=table-of-tokens

flake.nix

@@ -17,10 +17,10 @@
 	in {
 		packages = forAllSystems (pkgs: rec {
 			default = pkgs.buildNpmPackage {
-				name = "hi";
+				name = "myblog";
 				buildInputs = with pkgs; [
-            nodejs
-						vips
+					nodejs
+					vips
         ];
 				nativeBuildInputs = with pkgs; [
 					pkg-config

package.json

@@ -10,6 +10,7 @@
 		"debugstart": "DEBUG=Eleventy* npx @11ty/eleventy --serve --quiet",
 		"benchmark": "DEBUG=Eleventy:Benchmark* npx @11ty/eleventy"
 	},
+	"type": "module",
 	"repository": {
 		"type": "git",
 		"url": "git://github.com/11ty/eleventy-base-blog.git"
@@ -19,8 +20,9 @@
 		"node": ">=14"
 	},
 	"dependencies": {
+		"@11ty/eleventy": "^3.0.0",
 		"@11ty/eleventy-img": "^3.1.1",
-		"@11ty/eleventy": "^2.0.1"
+		"@11ty/eleventy-upgrade-help": "^3.0.1"
 	},
 	"devDependencies": {
 		"@11ty/eleventy-navigation": "^0.3.5",