Use export variables for site meta

eleventy.config.js

@@ -1,12 +1,14 @@
 // Installed Plugins
-const pluginRss = require("@11ty/eleventy-plugin-rss");
-const eleventyNavigationPlugin = require("@11ty/eleventy-navigation");
-const metagen = require('eleventy-plugin-metagen');
-const emojiReadTime = require("@11tyrocks/eleventy-plugin-emoji-readtime");
+import pluginRss from "@11ty/eleventy-plugin-rss";
+import eleventyNavigationPlugin from "@11ty/eleventy-navigation";
+import metagen from 'eleventy-plugin-metagen';
+import emojiReadTime from "@11tyrocks/eleventy-plugin-emoji-readtime";
 
-const slugify = require("slugify");
+import slugify from "slugify";
 
-module.exports = function (eleventyConfig) {
+import markdownPlugin from "./eleventy.config.md.js";
+
+export default function (eleventyConfig) {
     // Copy files
     eleventyConfig.addPassthroughCopy("./src/assets/");
     eleventyConfig.addWatchTarget("./src/assets/");
@@ -15,7 +17,7 @@ module.exports = function (eleventyConfig) {
     });
 
     // Custom Plugins
-    eleventyConfig.addPlugin(require('./eleventy.config.md.js'));
+    eleventyConfig.addPlugin(markdownPlugin);
 
     // Installed Plugins
     eleventyConfig.addPlugin(pluginRss);
@@ -25,7 +27,7 @@ module.exports = function (eleventyConfig) {
 
     // Eleventy bundle plugin
     eleventyConfig.addBundle("css");
-    eleventyConfig.addBundle("js");
+    eleventyConfig.addBundle("js", { toFileDirectory: "assets/js" });
 
     // Add content categories to a collection
     eleventyConfig.addCollection("categories", function(collectionApi) {

eleventy.config.md.js

@@ -1,16 +1,22 @@
 /* CONFIGURATION FOR MARKDOWN TEMPLATES */
 
 // Installed Plugins
-const pluginTOC = require('@uncenter/eleventy-plugin-toc');
-const embedEverything = require("eleventy-plugin-embed-everything");
+import pluginTOC from '@uncenter/eleventy-plugin-toc';
+import embedEverything from "eleventy-plugin-embed-everything";
 
 // Configure slug filter
-const slugify = require("slugify");
-// Configure markdown-it plugins
-const markdownIt = require("markdown-it");
-const markdownItAnchor = require("markdown-it-anchor");
+import slugify from "slugify";
 
-module.exports = function (eleventyConfig) {
+// markdown-it plugins
+import markdownIt from "markdown-it";
+import markdownItAnchor from "markdown-it-anchor";
+import markdownItAttribution from "markdown-it-attribution";
+import markdownItAttrs from "markdown-it-attrs";
+import markdownItBracketedSpans from 'markdown-it-bracketed-spans';
+import markdownItDefList from "markdown-it-deflist";
+import markdownItFootnote from "markdown-it-footnote";
+
+export default function (eleventyConfig) {
     // Installed Plugins
     eleventyConfig.addPlugin(pluginTOC, {
         tags: ['h2', 'h3', 'h4', 'h5', 'h6'],
@@ -73,11 +79,11 @@ module.exports = function (eleventyConfig) {
         linkify: true,
     })
         .use(markdownItAnchor, markdownItAnchorOptions)
-        .use(require("markdown-it-attribution"))
-        .use(require("markdown-it-attrs"))
-        .use(require("markdown-it-bracketed-spans"))
-        .use(require("markdown-it-deflist"))
-        .use(require('markdown-it-footnote'));
+        .use(markdownItAttribution)
+        .use(markdownItAttrs)
+        .use(markdownItBracketedSpans)
+        .use(markdownItDefList)
+        .use(markdownItFootnote);
 
     // Configure linkify
     markdownLibrary.linkify.set({ fuzzyLink: false });

package.json

@@ -4,6 +4,7 @@
     "start": "bunx @11ty/eleventy --serve --quiet",
     "build": "bunx @11ty/eleventy"
   },
+  "type": "module",
   "devDependencies": {
     "@types/bun": "^1.1.6"
   },

src/_data/sitemeta.js

@@ -1,13 +1,11 @@
-module.exports = {
-	siteName: "Leilukin's Hub",
-	siteUrl: "https://leilukin.com" || "http://localhost:8080",
-	siteDomain: "leilukin.com",
-	siteLocale: "en_MY",
-	siteLanguage: "en",
-	siteDescription: "Leilukin's personal website.",
-	siteAuthor: {
-		name: "Leilukin",
-		email: "contact@leilukin.com",
-		url: this.siteUrl + "/about"
-	}
-}
+export const siteName = "Leilukin's Hub";
+export const siteDomain = "leilukin.com";
+export const siteUrl = "https://" + siteDomain || "http://localhost:8080";
+export const siteAuthor = {
+	name: "Leilukin",
+	email: "contact@leilukin.com",
+	url: siteUrl + "/about"
+};
+export const siteLocale = "en_MY";
+export const siteLanguage = "en";
+export const siteDescription = siteAuthor.name + "'s personal website.";

src/_includes/global/metagen.njk

@@ -2,6 +2,7 @@
     desc=desc or metadata.desc,
     url=sitemeta.siteUrl + page.url,
     locale=sitemeta.siteLocale,
+    name=sitemeta.siteAuthor.name,
     site_name=sitemeta.siteName,
     img=image,
     img_alt=alt,

src/pages/guestbook.njk

@@ -5,10 +5,10 @@ eleventyNavigation:
 eleventyComputed:
     desc: Leave a message for {{ sitemeta.siteAuthor.name }}.
 ---
-{%- css %}{% include "src/assets/css/comments.css" %}{%- endcss %}
-{%- js %}{% include "src/assets/js/svgIconControl.js" %}{%- endjs %}
-{%- js %}{% include "src/assets/js/googleSheetsReaderGizmo.js" %}{%- endjs %}
-{%- js %}{% include "src/assets/js/comments.js" %}{%- endjs %}
+{%- css %}{% include "src/_bundle/css/comments.css" %}{%- endcss %}
+{%- js %}{% include "src/_bundle/js/svgIconControl.js" %}{%- endjs %}
+{%- js %}{% include "src/_bundle/js/googleSheetsReaderGizmo.js" %}{%- endjs %}
+{%- js %}{% include "src/_bundle/js/comments.js" %}{%- endjs %}
 
 <p class="center-text">Guestbook Archive: <a href="https://web.archive.org/web/20240528231121/https%3A%2F%2Fleilukin.123guestbook.com%2F">123Guestbook</a></p>