Skip to content

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'tokenizePlaceholders') #3485

@DilemmaGX

Description

@DilemmaGX

Marked version:
12.0.2 (Using with @denoland/deno-gfm)

deno info jsr:@deno/gfm
local: C:\Users\Yiming\AppData\Local\deno\remote\https\jsr.io\7b3587495e8c422bdbe163f6ea97e04c365fc7a9b16ec901cbf83000630f1bfb
type: TypeScript
dependencies: 31 unique
size: 9.1MB

https://jsr.io/@deno/gfm/0.9.0/mod.ts (14.38KB)
├─┬ https://jsr.io/@denosaurs/emoji/0.3.1/mod.ts (28B)
│ └─┬ https://jsr.io/@denosaurs/emoji/0.3.1/emoji.ts (4.37KB)
│   ├── https://jsr.io/@denosaurs/emoji/0.3.1/types.ts (1.1KB)
│   ├── https://jsr.io/@denosaurs/emoji/0.3.1/all.json (548.4KB)
│   └── https://jsr.io/@denosaurs/emoji/0.3.1/unicode.ts (3.82KB)
├── npm:/github-slugger@2.0.0 (15.53KB)
├── npm:/he@1.2.0 (121.23KB)
├─┬ npm:/katex@0.16.11 (3.78MB)
│ └── npm:/commander@8.3.0 (147.72KB)
├── npm:/marked@12.0.2 (902.79KB)
├─┬ npm:/marked-alert@2.1.0 (25.68KB)
│ └── npm:/marked@12.0.2 (902.79KB)
├─┬ npm:/marked-footnote@1.2.4 (23.75KB)
│ └── npm:/marked@12.0.2 (902.79KB)
├─┬ npm:/marked-gfm-heading-id@3.2.0 (29.17KB)
│ ├── npm:/github-slugger@2.0.0 (15.53KB)
│ └── npm:/marked@12.0.2 (902.79KB)
├── npm:/prismjs@1.29.0 (1.96MB)
├─┬ npm:/sanitize-html@2.13.1 (63.14KB)
│ ├── npm:/deepmerge@4.3.1 (30.43KB)
│ ├── npm:/escape-string-regexp@4.0.0 (3.7KB)
│ ├─┬ npm:/htmlparser2@8.0.2 (258.84KB)
│ │ ├── npm:/domelementtype@2.3.0 (11.09KB)
│ │ ├─┬ npm:/domhandler@5.0.3 (73.57KB)
│ │ │ └── npm:/domelementtype@2.3.0 (11.09KB)
│ │ ├─┬ npm:/domutils@3.1.0 (158.25KB)
│ │ │ ├─┬ npm:/dom-serializer@2.0.0 (28.14KB)
│ │ │ │ ├── npm:/domelementtype@2.3.0 (11.09KB)
│ │ │ │ ├── npm:/domhandler@5.0.3 (73.57KB) *
│ │ │ │ └── npm:/entities@4.5.0 (403.21KB)
│ │ │ ├── npm:/domelementtype@2.3.0 (11.09KB)
│ │ │ └── npm:/domhandler@5.0.3 (73.57KB) *
│ │ └── npm:/entities@4.5.0 (403.21KB)
│ ├── npm:/is-plain-object@5.0.0 (8.94KB)
│ ├── npm:/parse-srcset@1.0.2 (122.3KB)
│ └─┬ npm:/postcss@8.4.47 (195.55KB)
│   ├── npm:/nanoid@3.3.7 (23.79KB)
│   ├── npm:/picocolors@1.1.0 (11.16KB)
│   └── npm:/source-map-js@1.2.1 (136.59KB)
├── npm:/prismjs@1.29.0/components/prism-yaml.js *
└── https://jsr.io/@deno/gfm/0.9.0/style.ts (75.74KB)

Describe the bug
Using these imports:

Task test deno run --watch --allow-read --allow-write --allow-net --allow-import  --allow-env test/main.ts
Watcher Process started.
Processing file D:\Github\Moska\md\index.md
Processing file D:\Github\Moska\md\plans.md
Processing file D:\Github\Moska\md\playground.md
error: Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'tokenizePlaceholders')
Please report this to https://github.com/markedjs/marked.
    at file:///C:/Users/<USERNAME>/AppData/Local/deno/npm/registry.npmmirror.com/prismjs/1.29.0/components/prism-php.js:339:40
    at Object.run (file:///C:/Users/<USERNAME>/AppData/Local/deno/npm/registry.npmmirror.com/prismjs/1.29.0/prism.js:762:6)
    at Object.highlight (file:///C:/Users/<USERNAME>/AppData/Local/deno/npm/registry.npmmirror.com/prismjs/1.29.0/prism.js:671:12)
    at Renderer.code (https://jsr.io/@deno/gfm/0.9.0/mod.ts:75:24)
    at _Parser.parse (file:///C:/Users/<USERNAME>/AppData/Local/deno/npm/registry.npmmirror.com/marked/12.0.2/lib/marked.esm.js:1843:42)
    at parse (file:///C:/Users/<USERNAME>/AppData/Local/deno/npm/registry.npmmirror.com/marked/12.0.2/lib/marked.esm.js:1803:23)
    at Marked.parse (file:///C:/Users/<USERNAME>/AppData/Local/deno/npm/registry.npmmirror.com/marked/12.0.2/lib/marked.esm.js:2335:28)
    at Function.marked [as parse] (file:///C:/Users/<USERNAME>/AppData/Local/deno/npm/registry.npmmirror.com/marked/12.0.2/lib/marked.esm.js:2368:27)
    at render (https://jsr.io/@deno/gfm/0.9.0/mod.ts:165:23)
    at mdToHtml (file:///D:/Github/Moska/test/main.ts:35:16)
Watcher Process failed. Restarting on file change...

To Reproduce
Replace src/main.ts in DilemmaGX/Moska with:

import { walk } from "https://deno.land/std@0.170.0/fs/walk.ts";
import { ensureDir } from "https://deno.land/std@0.170.0/fs/ensure_dir.ts";
import { dirname, join } from "https://deno.land/std@0.170.0/path/mod.ts";
import { emptyDir } from "https://deno.land/std@0.170.0/fs/empty_dir.ts";
import { CSS, render } from "jsr:@deno/gfm";

import "npm:prismjs@1.29.0/components/prism-diff.js";
import "npm:prismjs@1.29.0/components/prism-javascript.js";
import "npm:prismjs@1.29.0/components/prism-typescript.js";
import "npm:prismjs@1.29.0/components/prism-jsx.js";
import "npm:prismjs@1.29.0/components/prism-tsx.js";
import "npm:prismjs@1.29.0/components/prism-css.js";
import "npm:prismjs@1.29.0/components/prism-cshtml.js";
import "npm:prismjs@1.29.0/components/prism-markdown.js";
import "npm:prismjs@1.29.0/components/prism-json.js";
import "npm:prismjs@1.29.0/components/prism-xml-doc.js";
import "npm:prismjs@1.29.0/components/prism-sql.js";
import "npm:prismjs@1.29.0/components/prism-bash.js";
import "npm:prismjs@1.29.0/components/prism-python.js";
import "npm:prismjs@1.29.0/components/prism-java.js";
import "npm:prismjs@1.29.0/components/prism-c.js";
import "npm:prismjs@1.29.0/components/prism-cpp.js";
import "npm:prismjs@1.29.0/components/prism-csharp.js";
import "npm:prismjs@1.29.0/components/prism-php.js";
import "npm:prismjs@1.29.0/components/prism-ruby.js";
import "npm:prismjs@1.29.0/components/prism-go.js";
import "npm:prismjs@1.29.0/components/prism-swift.js";
import "npm:prismjs@1.29.0/components/prism-kotlin.js";
import "npm:prismjs@1.29.0/components/prism-rust.js";

import { emojify } from 'npm:node-emoji'

async function mdToHtml(markdownPath: string): Promise<void> {
  const content = await Deno.readTextFile(markdownPath);
  const html = render(emojify(content), { allowMath: true, allowIframes: true });

  const relativePath = markdownPath.substring(Deno.cwd().length + 4);
  const outputPath = join("dist", relativePath.replace(".md", ".html"));
  await ensureDir(dirname(outputPath));

  const titleMatch = html.match(/<h1>(.*?)<\/h1>/i);
  let title = "Made with Moska";
  if (titleMatch && titleMatch.length > 1) {
    title = titleMatch[1];
  }
  const template = `
    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>${title}</title>
      <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/github-markdown-css/5.6.1/github-markdown.css">
      <style>
        .markdown-body {
          box-sizing: border-box;
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100vh;
          overflow:auto;
          margin: 0 auto;
          padding:45px;
          padding-left: 20%;
          padding-right: 20%;
        }
        @media (max-width: 767px) {
          .markdown-body {
            padding: 15px;
          }
        }
        ${CSS}
      </style>
      <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/katorlys/prism-theme-github/themes/prism-theme-github-light.css">
    </head>
    <body>
      <main data-color-mode="auto" data-light-theme="light" data-dark-theme="dark" class="markdown-body">
        ${html}
      </main>
    </body>
    <script>console.log("Made with Moska")</script>
    </html>
  `;
  await Deno.writeTextFile(outputPath, template);
}

async function main() {
  await emptyDir("dist");
  for await (const walkEntry of walk(Deno.cwd() + "/md")) {
    if (walkEntry.isFile && walkEntry.name.endsWith(".md")) {
      console.log("Processing file", walkEntry.path);
      await mdToHtml(walkEntry.path);
    }
  }
}

await main();

Deno.exit();

Expected behavior
Compile without any error.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions