commit 8d856805d63668e7d6efb5b4a49b04a63c365cf1 · pyrox.dev/blog

+1 -1

TODO.md

···

       7
       7
        
         - Performance, Accessibility, Best Practices, and SEO with

     

       8
       8
        
           [lighthouse-ci](https://github.com/GoogleChrome/lighthouse-ci/blob/main/docs/getting-started.md)

     

       9
       9
        
         - HTML, CSS, and JS validation

     

       10
       10
       -
           - [HTML-Validate](https://html-validate.org/)

     

       10
       10
       +
           - [x] [HTML-Validate](https://html-validate.org/)

     

       11
       11
        
           - [csstree-validator](https://www.npmjs.com/package/csstree-validator)

     

       12
       12
        
         - Grammar checking for source files(including inclusive language, spell checking, and other basic

     

       13
       13
        
           checks)

+8 -3

_config.ts

···

       23
       23
        
       import transform_images from "lume/plugins/transform_images.ts";

     

       24
       24
        
       

     

       25
       25
        
       // Markdown-it plugins

     

       26
       26
       -
       import { default as md_linenums } from "npm:markdown-it-inject-linenumbers@0.3.0";

     

       27
       26
        
       import { BiDirectionalLinks } from "npm:@nolebase/markdown-it-bi-directional-links";

     

       28
       27
        
       import { default as mdItObsidianCallouts } from "npm:markdown-it-obsidian-callouts";

     

       29
       28
        
       

     
···

       37
       36
        
       import googleFonts from "lume/plugins/google_fonts.ts";

     

       38
       37
        
       // // Optimization

     

       39
       38
        
       import lightningcss from "lume/plugins/lightningcss.ts";

     

       40
       40
       -
       import purgecss from "lume/plugins/purgecss.ts";

     

       39
       39
       +
       

     

       40
       40
       +
       // Validation

     

       41
       41
       +
       import validateHTML from "./plugins/validateHTML.ts";

     

       41
       42
        
       

     

       42
       43
        
       // Disabled Plugins:

     

       43
       44
        
       // import og_images from "lume/plugins/og_images.ts";

     

       44
       45
        
       // import pagefind from "lume/plugins/pagefind.ts";

     

       46
       46
       +
       // import purgecss from "lume/plugins/purgecss.ts";

     

       45
       47
        
       // import sri from "lume/plugins/sri.ts";

     

       46
       48
        
       // import nav from "lume/plugins/nav.ts";

     

       49
       49
       +
       // import { default as md_linenums } from "npm:markdown-it-inject-linenumbers@0.3.0";

     

       47
       50
        
       

     

       48
       51
        
       // To Add:

     

       49
       49
       -
       // https://deno.land/x/lume_markdown_plugins@v0.8.0 (toc and footnotes plugins)

     

       52
       52
       +
       // https://deno.land/x/lume_markdown_plugins@v0.8.0 (footnotes plugins)

     

       50
       53
        
       // https://deno.land/x/lume_shiki@0.0.16

     

       51
       54
        
       

     

       52
       55
        
       const site = lume({

     
···

       154
       157
        
       // Source Map Generation

     

       155
       158
        
       // Applies to CSS and JS

     

       156
       159
        
       site.use(source_maps());

     

       160
       160
       +
       

     

       161
       161
       +
       site.use(validateHTML());

     

       157
       162
        
       

     

       158
       163
        
       // Minify HTML Output

     

       159
       164
        
       site.use(minify_html({

+2 -1

deno.json

···

       5
       5
        
           "@nolebase/markdown-it-bi-directional-links": "npm:@nolebase/markdown-it-bi-directional-links@^2.14.0",

     

       6
       6
        
           "lume/": "https://cdn.jsdelivr.net/gh/lumeland/lume@f6e8b76726f84055e7d56f201bad44ab4162ed9c/",

     

       7
       7
        
           "markdown-it-obsidian-callouts": "npm:markdown-it-obsidian-callouts@^0.3.1",

     

       8
       8
       -
           "sharp": "npm:sharp@0.33.5"

     

       8
       8
       +
           "sharp": "npm:sharp@0.33.5",

     

       9
       9
       +
           "html-validate": "npm:html-validate@9.4.0"

     

       9
       10
        
         },

     

       10
       11
        
         "tasks": {

     

       11
       12
        
           "lume": "echo \"import 'lume/cli.ts'\" | deno run --env-file=.env.dev -A -",

+70

deno.lock

···

       68
       68
        
           "npm:dprint@*": "0.49.0",

     

       69
       69
        
           "npm:estree-walker@3.0.3": "3.0.3",

     

       70
       70
        
           "npm:highlight.js@11.11.1": "11.11.1",

     

       71
       71
       +
           "npm:html-validate@9.4.0": "9.4.0_ajv@8.17.1",

     

       71
       72
        
           "npm:ico-endec@0.1.6": "0.1.6",

     

       72
       73
        
           "npm:lightningcss-wasm@1.29.1": "1.29.1",

     

       73
       74
        
           "npm:markdown-it-attrs@4.3.1": "4.3.1_markdown-it@14.1.0",

     
···

       307
       308
        
               "tslib"

     

       308
       309
        
             ]

     

       309
       310
        
           },

     

       311
       311
       +
           "@html-validate/stylish@4.2.0": {

     

       312
       312
       +
             "integrity": "sha512-Nl8HCv0hGRSLQ+n1OD4Hk3a+Urwk9HH0vQkAzzCarT4KlA7bRl+6xEiS5PZVwOmjtC7XiH/oNe3as9Fxcr2A1w==",

     

       313
       313
       +
             "dependencies": [

     

       314
       314
       +
               "kleur@4.1.5"

     

       315
       315
       +
             ]

     

       316
       316
       +
           },

     

       310
       317
        
           "@imagemagick/magick-wasm@0.0.31": {

     

       311
       318
        
             "integrity": "sha512-QNivAUxSaItuiY8ziI/vRy6TtoecD7TOsD1LGZCG3wv8lfbdGbIj2QiJk0FlGkGwAVR966NlD3mkxPNvQrvq0w=="

     

       312
       319
        
           },

     
···

       487
       494
        
               "string.prototype.codepointat"

     

       488
       495
        
             ]

     

       489
       496
        
           },

     

       497
       497
       +
           "@sidvind/better-ajv-errors@3.0.1_ajv@8.17.1": {

     

       498
       498
       +
             "integrity": "sha512-++1mEYIeozfnwWI9P1ECvOPoacy+CgDASrmGvXPMCcqgx0YUzB01vZ78uHdQ443V6sTY+e9MzHqmN9DOls02aw==",

     

       499
       499
       +
             "dependencies": [

     

       500
       500
       +
               "ajv",

     

       501
       501
       +
               "kleur@4.1.5"

     

       502
       502
       +
             ]

     

       503
       503
       +
           },

     

       490
       504
        
           "@tailwindcss/oxide-android-arm64@4.0.3": {

     

       491
       505
        
             "integrity": "sha512-S8XOTQuMnpijZRlPm5HBzPJjZ28quB+40LSRHjRnQF6rRYKsvpr1qkY7dfwsetNdd+kMLOMDsvmuT8WnqqETvg=="

     

       492
       506
        
           },

     
···

       591
       605
        
           "@types/estree@1.0.6": {

     

       592
       606
        
             "integrity": "sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw=="

     

       593
       607
        
           },

     

       608
       608
       +
           "ajv@8.17.1": {

     

       609
       609
       +
             "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",

     

       610
       610
       +
             "dependencies": [

     

       611
       611
       +
               "fast-deep-equal",

     

       612
       612
       +
               "fast-uri",

     

       613
       613
       +
               "json-schema-traverse",

     

       614
       614
       +
               "require-from-string"

     

       615
       615
       +
             ]

     

       616
       616
       +
           },

     

       594
       617
        
           "ansi-regex@5.0.1": {

     

       595
       618
        
             "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ=="

     

       596
       619
        
           },

     
···

       885
       908
        
               "@types/estree"

     

       886
       909
        
             ]

     

       887
       910
        
           },

     

       911
       911
       +
           "fast-deep-equal@3.1.3": {

     

       912
       912
       +
             "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="

     

       913
       913
       +
           },

     

       888
       914
        
           "fast-glob@3.3.1": {

     

       889
       915
        
             "integrity": "sha512-kNFPyjhh5cKjrUltxs+wFx+ZkbRaxxmZ+X0ZU31SOsxCEtP9VPgtq2teZw1DebupL5GmDaNQ6yKMMVcM41iqDg==",

     

       890
       916
        
             "dependencies": [

     
···

       904
       930
        
               "merge2",

     

       905
       931
        
               "micromatch@4.0.8"

     

       906
       932
        
             ]

     

       933
       933
       +
           },

     

       934
       934
       +
           "fast-uri@3.0.6": {

     

       935
       935
       +
             "integrity": "sha512-Atfo14OibSv5wAp4VWNsFYE1AchQRTv9cBGWET4pZWHzYshFSS9NQI6I57rdKn9croWVMbYFbLhJ+yJvmZIIHw=="

     

       907
       936
        
           },

     

       908
       937
        
           "fastq@1.15.0": {

     

       909
       938
        
             "integrity": "sha512-wBrocU2LCXXa+lWBt8RoIRD89Fi8OdABODa/kEnyeyjS5aZO5/GNvI5sEINADqP/h8M29UHTHUb53sUu5Ihqdw==",

     
···

       996
       1025
        
           "highlight.js@11.11.1": {

     

       997
       1026
        
             "integrity": "sha512-Xwwo44whKBVCYoliBQwaPvtd/2tYFkRQtXDWj1nackaV2JPXx3L0+Jvd8/qCJ2p+ML0/XVkJ2q+Mr+UVdpJK5w=="

     

       998
       1027
        
           },

     

       1028
       1028
       +
           "html-validate@9.4.0_ajv@8.17.1": {

     

       1029
       1029
       +
             "integrity": "sha512-Io8vjeAf2JJJTHJDGvozVB6Vv/IZRkNRruSENg9lmLzE1gUcr77sIdtE2rzwLkBsCESDv5+nAAtk2TCer78jxA==",

     

       1030
       1030
       +
             "dependencies": [

     

       1031
       1031
       +
               "@html-validate/stylish",

     

       1032
       1032
       +
               "@sidvind/better-ajv-errors",

     

       1033
       1033
       +
               "ajv",

     

       1034
       1034
       +
               "glob@10.4.5",

     

       1035
       1035
       +
               "kleur@4.1.5",

     

       1036
       1036
       +
               "minimist",

     

       1037
       1037
       +
               "prompts",

     

       1038
       1038
       +
               "semver"

     

       1039
       1039
       +
             ]

     

       1040
       1040
       +
           },

     

       999
       1041
        
           "ico-endec@0.1.6": {

     

       1000
       1042
        
             "integrity": "sha512-ZdLU38ZoED3g1j3iEyzcQj+wAkY2xfWNkymszfJPoxucIUhK7NayQ+/C4Kv0nDFMIsbtbEHldv3V8PU494/ueQ=="

     

       1001
       1043
        
           },

     
···

       1060
       1102
        
           },

     

       1061
       1103
        
           "jsbi@4.3.0": {

     

       1062
       1104
        
             "integrity": "sha512-SnZNcinB4RIcnEyZqFPdGPVgrg2AcnykiBy0sHVJQKHYeaLUvi3Exj+iaPpLnFVkDPZIV4U0yvgC9/R4uEAZ9g=="

     

       1105
       1105
       +
           },

     

       1106
       1106
       +
           "json-schema-traverse@1.0.0": {

     

       1107
       1107
       +
             "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug=="

     

       1108
       1108
       +
           },

     

       1109
       1109
       +
           "kleur@3.0.3": {

     

       1110
       1110
       +
             "integrity": "sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w=="

     

       1111
       1111
       +
           },

     

       1112
       1112
       +
           "kleur@4.1.5": {

     

       1113
       1113
       +
             "integrity": "sha512-o+NO+8WrRiQEE4/7nwRJhN1HWpVmJm511pBHUxPLtp0BUISzlBplORYSmTclCnJvQq2tKu/sgl3xVpkc7ZWuQQ=="

     

       1063
       1114
        
           },

     

       1064
       1115
        
           "lightningcss-wasm@1.29.1": {

     

       1065
       1116
        
             "integrity": "sha512-yrcX5OfnB5NJY32h2kOCaUr/OUz/os51uy/dTqSi+Z5lkUgnI9XIzlFDjbru/DaMkJ7v08QKN14Yr75SvDnqjA==",

     
···

       1171
       1222
        
               "brace-expansion@2.0.1"

     

       1172
       1223
        
             ]

     

       1173
       1224
        
           },

     

       1225
       1225
       +
           "minimist@1.2.8": {

     

       1226
       1226
       +
             "integrity": "sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA=="

     

       1227
       1227
       +
           },

     

       1174
       1228
        
           "minipass@7.1.2": {

     

       1175
       1229
        
             "integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw=="

     

       1176
       1230
        
           },

     
···

       1373
       1427
        
               "source-map-js"

     

       1374
       1428
        
             ]

     

       1375
       1429
        
           },

     

       1430
       1430
       +
           "prompts@2.4.2": {

     

       1431
       1431
       +
             "integrity": "sha512-NxNv/kLguCA7p3jE8oL2aEBsrJWgAakBpgmgK6lpPWV+WuOmY6r2/zbAVnP+T8bQlA0nzHXSJSJW0Hq7ylaD2Q==",

     

       1432
       1432
       +
             "dependencies": [

     

       1433
       1433
       +
               "kleur@3.0.3",

     

       1434
       1434
       +
               "sisteransi"

     

       1435
       1435
       +
             ]

     

       1436
       1436
       +
           },

     

       1376
       1437
        
           "punycode.js@2.3.1": {

     

       1377
       1438
        
             "integrity": "sha512-uxFIHU0YlHYhDQtV4R9J6a52SLx28BCjT+4ieh7IGbgwVJWO+km431c4yRlREUAsAmt/uMjQUyQHNEPf0M39CA=="

     

       1378
       1439
        
           },

     
···

       1409
       1470
        
           },

     

       1410
       1471
        
           "remove-markdown@0.6.0": {

     

       1411
       1472
        
             "integrity": "sha512-B9g8yo5Zp1wXfZ77M1RLpqI7xrBBERkp7+3/Btm9N/uZV5xhXZjzIxDbCKz7CSj141lWDuCnQuH12DKLUv4Ghw=="

     

       1473
       1473
       +
           },

     

       1474
       1474
       +
           "require-from-string@2.0.2": {

     

       1475
       1475
       +
             "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw=="

     

       1412
       1476
        
           },

     

       1413
       1477
        
           "resolve@1.22.8": {

     

       1414
       1478
        
             "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==",

     
···

       1490
       1554
        
             "dependencies": [

     

       1491
       1555
        
               "is-arrayish"

     

       1492
       1556
        
             ]

     

       1557
       1557
       +
           },

     

       1558
       1558
       +
           "sisteransi@1.0.5": {

     

       1559
       1559
       +
             "integrity": "sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg=="

     

       1493
       1560
        
           },

     

       1494
       1561
        
           "source-map-js@1.2.1": {

     

       1495
       1562
        
             "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA=="

     
···

       2536
       2603
        
           "https://deno.land/x/lume_init@v0.3.0/steps/update.ts": "ae09f416ab44b628f1d3f9d1e3394f4e661bbb3d915661a4585c79e4147fdf0a",

     

       2537
       2604
        
           "https://deno.land/x/lume_init@v0.3.0/steps/utils.ts": "55fb173934c2f8db41cc0b0801783458f26f8c78ddb37fe67d2b38aba4513570",

     

       2538
       2605
        
           "https://deno.land/x/lume_init@v0.3.0/upgrade.ts": "2a5ca0b4ae0db1f6771e6ec4cede420b6c267e882a38e5647bc7218fda862483",

     

       2606
       2606
       +
           "https://deno.land/x/lume_markdown_plugins@v0.8.0/title.ts": "03cf0c80d1454385bda883e3ebbfe3c0dd8512d887ae5095303e447bfa45a0b0",

     

       2607
       2607
       +
           "https://deno.land/x/lume_markdown_plugins@v0.8.0/title/mod.ts": "f77140fdce40c65d5422ffc071803d6922e736fa83209dc7ace40006bf908432",

     

       2539
       2608
        
           "https://deno.land/x/lume_markdown_plugins@v0.8.0/toc.ts": "1fe2769056a022303b3871fc4b7be26b7738d44a31e5fd08debd527e9dc49ecc",

     

       2540
       2609
        
           "https://deno.land/x/lume_markdown_plugins@v0.8.0/toc/anchors.ts": "8a4a1c6b2c63156622695ceba57fa7100a6e5f109c9a383a1dcaf755233c8184",

     

       2541
       2610
        
           "https://deno.land/x/lume_markdown_plugins@v0.8.0/toc/mod.ts": "8c7aa6e1dcfabda4264503495a3875388108cd9a5a94b54853b45a8e8cba9f78",

     
···

       2577
       2646
        
             "npm:@catppuccin/tailwindcss@~0.1.6",

     

       2578
       2647
        
             "npm:@img/sharp-wasm32@0.33.5",

     

       2579
       2648
        
             "npm:@nolebase/markdown-it-bi-directional-links@^2.14.0",

     

       2649
       2649
       +
             "npm:html-validate@9.4.0",

     

       2580
       2650
        
             "npm:markdown-it-obsidian-callouts@~0.3.1",

     

       2581
       2651
        
             "npm:sharp@0.33.5"

     

       2582
       2652
        
           ]

+42

plugins/validateHTML.ts

···

       1
       1
       +
       import { ConfigData, formatterFactory, HtmlValidate, Report, Reporter } from "html-validate";

     

       2
       2
       +
       import "lume/types.ts";

     

       3
       3
       +
       import { merge } from "lume/core/utils/object.ts";

     

       4
       4
       +
       import { log } from "lume/core/utils/log.ts";

     

       5
       5
       +
       

     

       6
       6
       +
       export const defaults: ConfigData = {

     

       7
       7
       +
         extends: ["html-validate:recommended", "html-validate:document"],

     

       8
       8
       +
         rules: {

     

       9
       9
       +
           "doctype-style": "off",

     

       10
       10
       +
           "attr-quotes": "off",

     

       11
       11
       +
           "no-trailing-whitespace": "off",

     

       12
       12
       +
           "void-style": "warn",

     

       13
       13
       +
           "require-sri": ["error", { target: "crossorigin" }],

     

       14
       14
       +
         },

     

       15
       15
       +
       };

     

       16
       16
       +
       

     

       17
       17
       +
       export default function (userOptions?: ConfigData) {

     

       18
       18
       +
         const options = merge(defaults, userOptions);

     

       19
       19
       +
         const htmlvalidate = new HtmlValidate(options);

     

       20
       20
       +
         const format = formatterFactory("text");

     

       21
       21
       +
       

     

       22
       22
       +
         return (site: Lume.Site) => {

     

       23
       23
       +
           site.process([".html"], validatePages);

     

       24
       24
       +
       

     

       25
       25
       +
           async function validatePages(pages: Lume.Page[]) {

     

       26
       26
       +
             var reports: Array<Promise<Report>> = [];

     

       27
       27
       +
             for (const page of pages) {

     

       28
       28
       +
               const report = await htmlvalidate.validateString(page.content as string, page.outputPath);

     

       29
       29
       +
               reports.push(report);

     

       30
       30
       +
             }

     

       31
       31
       +
             const merged: Report | Promise<Report> = Reporter.merge(reports);

     

       32
       32
       +
       

     

       33
       33
       +
             if (merged.valid) {

     

       34
       34
       +
               log.info("[validateHTML] Validation successful!");

     

       35
       35
       +
             }

     

       36
       36
       +
       

     

       37
       37
       +
             if (!merged.valid) {

     

       38
       38
       +
               log.error("[validateHTML]:\n" + format(merged.results));

     

       39
       39
       +
             }

     

       40
       40
       +
           }

     

       41
       41
       +
         };

     

       42
       42
       +
       }