nuxt-community/nuxtent-module

Unable to extend markdown parser

Gingernaut opened this issue · 3 comments

Version

1.4.1

Reproduction link

https://github.com/Gingernaut/gingernaut.github.io/tree/dev

Steps to reproduce

Extending the markdown parser in my nuxtent.config.js does not work, using the Prism.js configuration at https://nuxtent.now.sh/guide/configuration#parser-options.

My entire nuxtent config:

const Prism = require('prismjs')

module.exports = {
  content: [
    ['blog', {
      page: '/blog/my-article',
      permalink: '/blog/:slug',
      isPost: true,
      generate: [
        'get',
        'getAll'
      ]
    }]],
  api: {
    baseURL: 'http://localhost:3000',
    browserBaseURL: 'http://localhost:3000'
  },
  md: {
    extend (config) {
      config.highlight = (code, lang) => {
        return `<pre class="language-${lang}"><code class="language-${lang}">${Prism.highlight(code, Prism.languages[lang], Prism.languages[lang])}</code></pre>`
      }
    }
  }
}

I've added the nuxtent module in my nuxt.config.js, and that is where I also load the prism CSS with:

  css: [
    'prismjs/themes/prism-okaidia.css'
  ]

What is expected ?

The markdown parser to properly extend the highlight option to use Prism js to highlihgt my

tags.

What is actually happening?

All of the 'pre' syntax highlighting loads from the css for the theme, rendering the text white with a shadow. However the rendered html does not have any of span tags parsed by Prism, and pre tag does not have the class applied either. Effectively, There is no difference in the page whether I extend the markdown parser or not.

This bug report is available on Nuxt.js community (#c125)

@Gingernaut

Try this and see if it works for you.

  parsers: {
    md: {
      extend(config) {
        config.highlight = (code, lang) => {
          return `<pre class="language-${lang}"><code class="language-${lang}">${Prism.highlight(code, Prism.languages[lang] || Prism.languages.markup)}</code></pre>`
        }
      }
    }
  }

That did work for me, thanks for the help.

No problem at all. 👍