Use ESM instead of CommonJS

Eleventy v3.0.0 fully supports ESM.
- ref: https://github.com/11ty/eleventy/releases/tag/v3.0.0

Additionally, using `require("@11ty/eleventy")` with Eleventy v3.0.0 results
in compatibility issues as follows. Therefore, this is an appropriate time to
migrate our configuration from CommonJS to ESM.

```
> [email protected] build:11ty
> eleventy --pathprefix=hotwire_ja

[11ty] Eleventy Error (CLI):
[11ty] 1. Error in your Eleventy config file '.eleventy.js'. (via EleventyConfigError)
[11ty] 2. `require("@11ty/eleventy")` is incompatible with Eleventy v3 and this version of Node. You have a few options:
[11ty]    1. (Easiest) Change the `require` to use a dynamic import inside of an asynchronous CommonJS configuration
[11ty]       callback, for example:
[11ty]
[11ty]       module.exports = async function {
[11ty]         const {EleventyRenderPlugin, EleventyI18nPlugin, EleventyHtmlBasePlugin} = await import("@11ty/eleventy");
[11ty]       }
[11ty]
[11ty]    2. (Easier) Update the JavaScript syntax in your configuration file from CommonJS to ESM (change `require`
[11ty]       to use `import` and rename the file to have an `.mjs` file extension).
[11ty]
[11ty]    3. (More work) Change your project to use ESM-first by adding `"type": "module"` to your package.json. Any
[11ty]       `.js` will need to be ported to use ESM syntax (or renamed to `.cjs`.)
[11ty]
[11ty]    4. (Short term workaround) Use the --experimental-require-module flag to enable this behavior. Read
[11ty]       more: https://nodejs.org/api/modules.html#loading-ecmascript-modules-using-require It is possible that the
[11ty]       newest version of Node has this enabled by default—you can try upgrading your version of Node.js.
ERROR: "build:11ty" exited with 1.
```

.eleventy.js

@@ -1,27 +1,32 @@
-const { EleventyHtmlBasePlugin } = require("@11ty/eleventy");
-const syntaxHighlight = require("@11ty/eleventy-plugin-syntaxhighlight");
-const markdownItAnchor = require('markdown-it-anchor');
-const markdownItToc = require('markdown-it-toc-done-right');
+import { EleventyHtmlBasePlugin } from "@11ty/eleventy";
+import syntaxHighlight from "@11ty/eleventy-plugin-syntaxhighlight";
+import markdownItAnchor from "markdown-it-anchor";
+import markdownItToc from "markdown-it-toc-done-right";
+import markdownIt from "markdown-it";
 
-// enable everything
-var md = require('markdown-it')({
-  html: true,
-  linkify: true,
-  typographer: true
-});
+export default function (eleventyConfig) {
+  eleventyConfig.setLibrary("md", markdownIt({
+    html: true,
+    linkify: true,
+    typographer: true
+  }));
 
-module.exports = function(eleventyConfig) {
-  md.use(markdownItAnchor, { // add anchors to headings
-    level: '2',
-    permalink: markdownItAnchor.permalink.ariaHidden({
-      class: 'anchor',
-      symbol: '#',
-      placement: 'before'
-    }),
+  eleventyConfig.amendLibrary("md", (mdLib) => {
+    return mdLib.use(markdownItAnchor, { // add anchors to headings
+      level: '2',
+      permalink: markdownItAnchor.permalink.ariaHidden({
+        class: 'anchor',
+        symbol: '#',
+        placement: 'before'
+      })
+    });
   });
-  md.use(markdownItToc, { // make a TOC with ${toc}
-    level: '2',
-    listType: 'ul'
+
+  eleventyConfig.amendLibrary("md", (mdLib) => {
+    return mdLib.use(markdownItToc, { // make a TOC with ${toc}
+      level: '2',
+      listType: 'ul'
+    });
   });
 
   eleventyConfig.addCollection('turbo_handbook', collectionApi => {
@@ -38,8 +43,7 @@ module.exports = function(eleventyConfig) {
 
   eleventyConfig.addPlugin(EleventyHtmlBasePlugin);
   eleventyConfig.addPlugin(syntaxHighlight);
-  eleventyConfig.addPassthroughCopy({ '_assets': 'assets' });
-  eleventyConfig.setLibrary('md', md);
+  eleventyConfig.addPassthroughCopy({'_assets': 'assets'});
   eleventyConfig.setDataDeepMerge(true);
 
   return {

package.json

@@ -5,6 +5,7 @@
   "repository": "[email protected]:everyleaf/hotwire_ja.git",
   "author": "akira888 <[email protected]>",
   "license": "MIT",
+  "type": "module",
   "devDependencies": {
     "@11ty/eleventy": "^3.0.0",
     "@11ty/eleventy-plugin-syntaxhighlight": "^5.0.0",