diff --git a/eleventy.config.js b/eleventy.config.js index b304723..0faee27 100644 --- a/eleventy.config.js +++ b/eleventy.config.js @@ -4,7 +4,8 @@ // // -const directoryOutputPlugin = require('@11ty/eleventy-plugin-directory-output'); +const pluginDirectoryOutput = require('@11ty/eleventy-plugin-directory-output'); +const pluginTOC = require('eleventy-plugin-toc'); // const collections = require('./source/_config/eleventy.collections.js'); @@ -13,6 +14,7 @@ const shortcodes = require('./source/_config/eleventy.shortcodes.js'); // const markdownIt = require('markdown-it'); +const markdownItAnchor = require('markdown-it-anchor'); // const { DateTime } = require('luxon'); @@ -22,6 +24,20 @@ const htmlmin = require('html-minifier'); // const isProduction = process.env.NODE_ENV === 'product'; +// +const mdOptions = { + html: true, + breaks: true, + linkify: true, + typographer: true +}; +const mdAnchorOpts = { + permalink: true, + permalinkClass: 'anchor-link', + permalinkSymbol: '#', + level: [1, 2, 3, 4] +}; + // // @@ -32,7 +48,7 @@ module.exports = function (eleventyConfig) { // eleventy-plugin-directory-output // - eleventyConfig.addPlugin(directoryOutputPlugin, { + eleventyConfig.addPlugin(pluginDirectoryOutput, { columns: { filesize: true, benchmark: true, @@ -86,14 +102,28 @@ module.exports = function (eleventyConfig) { // Markdown-it // - let markdownIt_options = { - // https://github.com/markdown-it/markdown-it#init-with-presets-and-options - html: true, - breaks: true, - linkify: true, - }; - let markdownLib = markdownIt(markdownIt_options); - eleventyConfig.setLibrary('md', markdownLib); +// let markdownIt_options = { +// // https://github.com/markdown-it/markdown-it#init-with-presets-and-options +// html: true, +// breaks: true, +// linkify: true, +// }; +// let markdownLib = markdownIt(markdownIt_options); +// eleventyConfig.setLibrary('md', markdownLib); + + eleventyConfig.setLibrary( + 'md', + markdownIt(mdOptions) + .use(markdownItAnchor, mdAnchorOpts) + ); + + eleventyConfig.addPlugin(pluginTOC, { + tags: ['h2', 'h3', 'h4'], // which heading tags are selected headings must each have an ID attribute + wrapper: 'div', // element to put around the root `ol`/`ul` + wrapperClass: 'toc', // class for the element around the root `ol`/`ul` + ul: true, // if to use `ul` instead of `ol` + flat: false, // if subheadings should appear as child of parent or as a sibling + }); // // 11ty Nunjucks Environment Options @@ -166,6 +196,9 @@ module.exports = function (eleventyConfig) { }); } + eleventyConfig.addWatchTarget('./source/contents/**/*.md'); + eleventyConfig.addWatchTarget('./source/sections/**/*.md'); + // // display 11ty's events // diff --git a/package.json b/package.json index bd09658..b820816 100644 --- a/package.json +++ b/package.json @@ -24,10 +24,12 @@ "@11ty/eleventy": "^2.0.1", "@11ty/eleventy-plugin-directory-output": "^1.0.1", "cross-env": "^7.0.3", + "eleventy-plugin-toc": "^1.1.5", "html-escaper": "^3.0.3", "html-minifier": "^4.0.0", "luxon": "^3.4.4", "markdown-it": "^13.0.2", + "markdown-it-anchor": "^8.6.7", "npm-check-updates": "^16.14.11", "npm-run-all": "^4.1.5", "rimraf": "^5.0.5", diff --git a/source/_includes/layouts/post.njk b/source/_includes/layouts/post.njk index e23870c..e1460e6 100644 --- a/source/_includes/layouts/post.njk +++ b/source/_includes/layouts/post.njk @@ -2,5 +2,10 @@ {% block contentMain %} + {% if true == toc %} +
+ {{ content | toc | safe }} + {% endif %} + {{ content | safe }} {% endblock %} diff --git a/source/contents/404.md b/source/contents/404.md index f9fd939..7d9ec7e 100644 --- a/source/contents/404.md +++ b/source/contents/404.md @@ -4,6 +4,7 @@ order: 40 permalink: /404.html layout: post.njk date: 2022-08-21 01:01:02 +toc: false --- Rem amet deleniti vel error debitis non iure enim et omnis illum? Eum officiis neque ex galisum repellat qui itaque nihil id laboriosam consequuntur aut laboriosam aliquam aut enim veritatis ut quas voluptatum. diff --git a/source/contents/index.md b/source/contents/index.md index 6a28d19..831d5c7 100644 --- a/source/contents/index.md +++ b/source/contents/index.md @@ -4,6 +4,7 @@ permalink: /index.html order: 50 layout: home.njk date: 2022-08-21 01:01:01 +toc: false --- Lorem ipsum dolor sit amet. Qui incidunt rerum aut expedita aliquam ex magni galisum est quia alias. Est fugit neque est neque possimus quo voluptates ipsa ad dignissimos sapiente ut voluptates laborum. Qui quisquam animi ut quas beatae in excepturi deleniti qui quia modi deleniti expedita. 33 suscipit odit eum eligendi error ad aperiam amet et nostrum ratione in ipsam earum et temporibus dolores. A doloremque architecto sit iusto atque et odio dolore aut praesentium praesentium qui sint deserunt et beatae harum. diff --git a/source/contents/parent01/child01/grandchild01.md b/source/contents/parent01/child01/grandchild01.md index fda76d8..a8d106c 100644 --- a/source/contents/parent01/child01/grandchild01.md +++ b/source/contents/parent01/child01/grandchild01.md @@ -4,6 +4,7 @@ permalink: /parent01/child01/grandchild01/index.html order: 100 layout: post.njk date: 2022-10-21 01:01:01 +toc: false --- ### {{ title }} diff --git a/source/contents/parent01/child01/grandchild02.md b/source/contents/parent01/child01/grandchild02.md index 762ef80..7ecaef1 100644 --- a/source/contents/parent01/child01/grandchild02.md +++ b/source/contents/parent01/child01/grandchild02.md @@ -4,6 +4,7 @@ permalink: /parent01/child01/grandchild02/index.html order: 200 layout: post.njk date: 2022-10-21 02:01:01 +toc: false --- ### {{ title }} diff --git a/source/contents/parent01/child01/index.md b/source/contents/parent01/child01/index.md index 7a71ec5..a936463 100644 --- a/source/contents/parent01/child01/index.md +++ b/source/contents/parent01/child01/index.md @@ -4,6 +4,7 @@ permalink: /parent01/child01/index.html order: 1 layout: post.njk date: 2022-10-21 00:00:01 +toc: false --- ### {{ title }} diff --git a/source/contents/parent01/child02/grandchild01/index.md b/source/contents/parent01/child02/grandchild01/index.md index f8a2c9f..3007301 100644 --- a/source/contents/parent01/child02/grandchild01/index.md +++ b/source/contents/parent01/child02/grandchild01/index.md @@ -4,6 +4,7 @@ permalink: /parent01/child02/grandchild01/index.html order: 1 layout: post.njk date: 2022-10-22 01:00:01 +toc: false --- ### {{ title }} diff --git a/source/contents/parent01/child02/grandchild02/index.md b/source/contents/parent01/child02/grandchild02/index.md index e20d117..d50160b 100644 --- a/source/contents/parent01/child02/grandchild02/index.md +++ b/source/contents/parent01/child02/grandchild02/index.md @@ -4,6 +4,7 @@ permalink: /parent01/child02/grandchild02/index.html order: 2 layout: post.njk date: 2022-10-22 02:00:01 +toc: false --- ### {{ title }} diff --git a/source/contents/parent01/child02/grandchild03/index.md b/source/contents/parent01/child02/grandchild03/index.md index 169300f..daf6a8c 100644 --- a/source/contents/parent01/child02/grandchild03/index.md +++ b/source/contents/parent01/child02/grandchild03/index.md @@ -4,6 +4,7 @@ permalink: /parent01/child02/grandchild03/index.html order: 3 layout: post.njk date: 2022-10-22 03:00:01 +toc: false --- ### {{ title }} diff --git a/source/contents/parent01/child02/index.md b/source/contents/parent01/child02/index.md index 47007af..88b16d7 100644 --- a/source/contents/parent01/child02/index.md +++ b/source/contents/parent01/child02/index.md @@ -4,6 +4,7 @@ permalink: /parent01/child02/index.html order: 2 layout: post.njk date: 2022-10-22 00:00:01 +toc: false --- ### {{ title }} diff --git a/source/contents/parent01/child03/index.md b/source/contents/parent01/child03/index.md index ae59841..298c385 100644 --- a/source/contents/parent01/child03/index.md +++ b/source/contents/parent01/child03/index.md @@ -4,6 +4,7 @@ permalink: /parent01/child03/index.html order: 3 layout: post.njk date: 2022-10-23 01:01:01 +toc: false --- ### {{ title }} diff --git a/source/contents/parent01/index.md b/source/contents/parent01/index.md index aeb5a20..b6cd6ac 100644 --- a/source/contents/parent01/index.md +++ b/source/contents/parent01/index.md @@ -4,6 +4,7 @@ permalink: /parent01/index.html order: 20 layout: post.njk date: 2022-10-20 00:00:01 +toc: false --- In sint veniam ut voluptas obcaecati in Quis maiores cum ratione commodi recusandae dolor! Aut explicabo maiores aut vitae mollitia sit debitis voluptas ut assumenda labore? diff --git a/source/contents/parent02/child01.md b/source/contents/parent02/child01.md index 6ea566a..3da3ae8 100644 --- a/source/contents/parent02/child01.md +++ b/source/contents/parent02/child01.md @@ -4,6 +4,7 @@ permalink: /parent02/child01/index.html order: 1 layout: post.njk date: 2022-11-11 00:00:01 +toc: false --- ### {{ title }} diff --git a/source/contents/parent02/child02.md b/source/contents/parent02/child02.md index 75fc13f..5ca37a6 100644 --- a/source/contents/parent02/child02.md +++ b/source/contents/parent02/child02.md @@ -4,6 +4,7 @@ permalink: /parent02/child02/index.html order: 2 layout: post.njk date: 2022-11-12 00:00:01 +toc: false --- ### {{ title }} diff --git a/source/contents/parent02/child03.md b/source/contents/parent02/child03.md index 1f4ab47..bc178bb 100644 --- a/source/contents/parent02/child03.md +++ b/source/contents/parent02/child03.md @@ -4,6 +4,7 @@ permalink: /parent02/child03/index.html order: 3 layout: post.njk date: 2022-11-13 00:00:01 +toc: false --- ### {{ title }} diff --git a/source/contents/parent02/index.md b/source/contents/parent02/index.md index 56d814a..54230f0 100644 --- a/source/contents/parent02/index.md +++ b/source/contents/parent02/index.md @@ -4,6 +4,7 @@ permalink: /parent02/index.html order: 30 layout: post.njk date: 2022-11-10 00:00:01 +toc: false --- Nam rerum perferendis sit nostrum laborum aut deleniti assumenda quo esse rerum ut officia quasi. Aut quaerat galisum et voluptas commodi qui sapiente laudantium. In labore repellat vel omnis magnam non facilis eius sed aliquid ipsa. Et explicabo voluptas vel temporibus autem ut reprehenderit consectetur ea amet voluptatem et nisi itaque non tempora veritatis non quia consequuntur. diff --git a/source/contents/test01/index.md b/source/contents/test01/index.md index 25ac707..15a960b 100644 --- a/source/contents/test01/index.md +++ b/source/contents/test01/index.md @@ -4,6 +4,7 @@ order: 11 permalink: /test01/index.html layout: post.njk date: 2022-12-12 00:00:01 +toc: false --- ### {{ title }} diff --git a/source/contents/test02/index.md b/source/contents/test02/index.md index 562cdd3..2b82a5b 100644 --- a/source/contents/test02/index.md +++ b/source/contents/test02/index.md @@ -4,6 +4,7 @@ order: 12 permalink: /test02/index.html layout: post.njk date: 2022-12-15 00:00:01 +toc: false --- ### {{ title }} diff --git a/source/contents/test03/index.md b/source/contents/test03/index.md new file mode 100644 index 0000000..e877733 --- /dev/null +++ b/source/contents/test03/index.md @@ -0,0 +1,102 @@ +--- +title: Test 03 page, using eleventy-plugin-toc +order: 13 +permalink: /test03/index.html +layout: post.njk +date: 2023-12-05 00:00:01 +toc: true +--- + +[link_markdown-it-table-of-contents]: https://www.npmjs.com/package/markdown-it-table-of-contents +[link_markdown-it-anchor]: https://www.npmjs.com/package/markdown-it-anchor +[link_eleventy-plugin-toc]: https://www.npmjs.com/package/eleventy-plugin-toc + + +I'm using [markdown-it-table-of-contents][link_markdown-it-table-of-contents] (and [markdown-it-anchor][link_markdown-it-anchor]). +When using this to expand the TOC, I understand that it can only be made into a Markdown file. + +What I would like to achieve in the future is complete separation of content and TOC. +My ideal is a normal layout with TOC on either the left or right and the body in the center. +To achieve this, I think you need to tell a template engine like Nunjucks where to extract the TOC and content. +However, due to my lack of skills, I was not able to achieve this using the existing system. +For this reason, I decided to try another Npm package, [eleventy-plugin-toc][link_eleventy-plugin-toc]. + + +### 前述の和訳 + +私は[markdown-it-table-of-contents][link_markdown-it-table-of-contents]（および[markdown-it-anchor][link_markdown-it-anchor]）を使用しています。 +これを使って目次を展開する場合、Markdownファイルにするしか、記述できない事は理解しています。 + +将来的にはコンテンツと目次を完全に分離したいと考えています。 +私の理想は、TOCが左右どちらかにあり、本文が中央にある通常のレイアウトです。 +これを実現するには、Nunjucksの様なテンプレートエンジンに目次とコンテンツを抽出する場所を指示する必要があると思います。 +しかし、私のスキル不足により、既存のシステムではそれを実現することができませんでした。 +このため、別のNpmパッケージである[eleventy-plugin-toc][link_eleventy-plugin-toc]を試す事にしました。 + + + + + +#### 小太鼓はばかのびっくり間汁に甘藍とおろしぶんたで (H4) + +いやしばらく正確たますという巻なな。変ませましんたはましではおいでの上手たちのなかがしかとんとんいやでしたて、やつじゃゴーシュをいうられることだです。 + +きすぎみんなはゴーシュが高くませて一生けん命の手のセロたちから笑っ第何音館のまねをはくすからいたまし。向うは今日飛び立ちてやった。ドアは六しかっこうのようからとまって出した。ラプソディも火花たばこたりおれをぶっつけていた。かっこうもゴーシュをいきなりに見てぼうを窓のようを膨らんてゴーシュが起きあがってそっとむしを許しがきな。 + +ばたばたすっかり音を音にしたた。ここら思わずにひとりがたべて狸をこりますな。 + + +#### ゴーシュへ置いないた (H4) + +「どなりでかかえた。音楽、みんなでまわり。云い。」ぼくは今のうちのどんどん半分のところにあいだなく。 + +頭は音楽でおねずみをしが子へ赤をしゃくにさわってがらんと一生けん命くらべがっんなかへ困るたた。じつにびっくりしが、ふみとあわてていましてなんどへまた巻でそんなに日考えだっます。「ねずみしまい。箱へやりない。云っよ。どこも何をゴーシュにとってなど弾き出しパンは恐いことでてよ。」 + +やつは生意気そうをひるてかい遁先生を追い払っとでし東のだいがしからねむらや知らてはじめまし。 + + +### 弓も合わて床にしないた (H3) + +それはぼろぼろいっしょもみじかいんんて専門はまったく永くふしたん。「はじめの夜の糸が。し。」何はそうしたまし。力は手をしと前まし。またはじめはおいおいきっだた。うまい病気ましとしでててしんが居りようましぐったがってしばらくくしゃみをするようなをせとそれでやはり顔に人やめなくまし。こうかとセロもてとうとうしただて悪い気をも一生けん命もお母さんの足たです。 + +ぐったがってしばらくくしゃみをするようなは何がはじめまし嵐のところ何を鳴ったようになあ猫クラリネットを家につかまえるでここか弾いのがこぼしてつづけました。「ではいきなり前の先生。し。」こらと叫びがとけたかとすわりていきなり風が楽長からよろよろ出てゴーシュしましまし。「まっ黒た。どんなにして来だら。 + + +### このどころは手の町はずれたんん (H3) + +何にこのもう出だことで。セロ。 + +演奏までなんだか泣き声一ぺんもないんたなあ。ねずみにセロを云ってやろそれ曲からその火事ゴーシュかっこうとねずみらのねずみじゃのガラスばかにもっていますそんなにこれのちがいはうとうときれんだ。ゴーシュお母さんさん。さんをも云いのたての。ひもというのにどんと云いいた。過ぎもあいは外においてもんのこんこんやったものまい。だってにわかにぐるぐるねずみのセロと押し出したはよ。 + + +#### あんななかみんなか外ゴーシュの外からかっこうっといるんから弾きたまし (H4) + +「ゴーシュみんなか。」野ねずみも仕上げますように追い払っなまし。また入ってばへしてつかまえながらだしないんは今度じゃ二十ぺんなっならものになっその六位遁たまし。 + +ひとの楽長が考えるなさっき食うましセロがとうに物すごいそうに弾きがきてホールのはじめであるていますだ。「ありがとうしです。まだおじぎはひどくたなあ。」「みんなませながら」子になっますた。 + +「これごすみまし。済ましてしまい。」 + +十ぺん小麦をしょったまし。ホールはつかまえてのいったいを一日をぶっつかったまし。「おれに云いさんを外国なんてもぐり込みていとわかっませ。第一何が叩く扉館へ出すていたのまでひくか。 + +するとそのまわりだってどこの小太鼓の何まし。いつた。こわくはなったそっちにひるながら。夜までも処のゴーシュが思い切ったりゴーシュだやしましのはみんなましだ。 + +行っばまわっ。 + + +##### 文字は要件メディアが保有しペディアなます以下 (H5) + +利用しれ方針を信頼権可能の前記財団がされてはするで、フレーズの目的も、信頼するファイルを研究することという執筆十分ませですてなりなない。 +しかし、アートの回避名は、ライセンスの参考し留意独自なく原則が出版さ、その主題に科さば列で引用しことに書評するれで。またを、運用部分が執筆挙げれている脚注を既に問いしことも、前記ません、自らによるは著作国の許諾として記事中の問題も係ることが、お留意物も、可能の検証にしと記事に引用するたばいるなませ。引用しと、その他の著作もなくかもさますで。 + + +##### あるいは、権利にBYとする文という (H5) + +たとえば、被利用等に、削除する記事の記事、文章で自由に投稿することをするて、タイトル要件の引用に対象を考慮できことでして、執筆するな例外を許諾、閲覧国発表ないあっとの投稿を行うことも、たとえ短いとしてよいませある。したがって仮には、改変台詞に創作有しれてい方針を決して保有し、事典上に引用しことに対する、権利の記事において部分の引用が厳しい引用ありことをいいな。 + + +#### みんなもさっさと狩の扉が見うてこさえよられんものまし (H4) + +無理た。ゴーシュはかっきりばかねずみからあるてついこどものひかるたようにぶんおろしながらあけるでするでいよいよ音のやぶれて見ろますでし。「またおどかしよ。」手はこれをしんか愕の長椅子を困るで狸はこれ負けてこい、けれども譜にあわせがねずみに立てましです。するとねずみが二二拍すぎのしんのゴーシュで工合のなかへ夜だけ血走っていたた。「おまえでなさいと。」「トロメライ、狸活動。」おいでも穴へとっがいいてすうなた。「なるべくか。 + +トロメライにとってんはそのんか。」下待てはそれがいただけたかつまりんへんをできるてまし子の子の馬車がすこし起きあがっですた。