How to change the rendering order, so `mustache` calls are parsed before html anchor links? #2483

t-391 · 2024-08-03T22:39:07Z

t-391
Aug 3, 2024

Hello all, I'm using Docsify with the following setup:

Relevant section of index.html

  <script>
    window.$docsify = {
      loadSidebar: true,
      subMaxLevel: 3,
      name: '',
      repo: '',
      mustache: {
        data: [
          'docs/vars.json'
        ]
      },
      mermaidConfig: {
        querySelector: ".mermaid",
      }
    }
  </script>
  <!-- Docsify v4 -->
  <script src="//cdn.jsdelivr.net/npm/docsify@4"></script>
  <script src="//cdn.jsdelivr.net/npm/docsify-mustache"></script>

For mustache templates (link), the key value pairs are structured as JSON files.

Relevant section of docs/vars.json

{
    "build_sequence": {
        "op001": "Introduction",
        "op002": "Middle Section",
        "op003": "Final Section"
    },

So if I write up a markdown page with the following format, it will render properly:

## {{build_sequence.op001}} //outputs "Introduction"  
## {{build_sequence.op002}} //outputs "Middle Section"  
## {{build_sequence.op003}} //outputs "Final Section"

Using the marked engine, an anchor ID will also be created, first by performing the following transformations (per the Markdown spec):

strip out non alphanumeric characters
convert all text to lowercase
replace spaces with -
append a number at the end, if there are repeats

As an example, ## {{build_sequence.op003}} will generate the following anchor link: http://localhost:3000/#/docs/guide?id=final-section.

However if I attempt to internally link from a different page:

Here is an anchor link directly passed in: [link](#{{build_sequence.op003}})

This will not resolve with a link to http://localhost:3000/#/docs/guide?id=final-section. Instead, it will parse to: Here is an anchor link directly passed in: [link](#Final Section)

I also tried this using triple braces (mustache escape sequence) and this didn't help.

I believe what's happening is that the "marked" renderer running in the background first parses HTML links, then later, the mustache plugin renders all it's own function calls. In reading the docsify documentation, it seems that the behavior of the parser can be changed here, but this is where I get stuck, as I don't have the expertise in Javascript.

Is there a way to force the intended behavior?

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Uh oh!

How to change the rendering order, so `mustache` calls are parsed before html anchor links? #2483

Uh oh!

{{title}}

Uh oh!

Replies: 0 comments

Select a reply

Uh oh!

Uh oh!

How to change the rendering order, so mustache calls are parsed before html anchor links? #2483

Uh oh!

t-391 Aug 3, 2024

Replies: 0 comments

How to change the rendering order, so `mustache` calls are parsed before html anchor links? #2483

t-391
Aug 3, 2024