Skip to content

Cannot get customer renderers to function #369

@j-d-carmichael

Description

@j-d-carmichael

No matter what i do i keep getting:

Could not find the language 'vue', did you forget to load/include a language module?

import hljs from 'highlight.js/lib/core'
import xml from 'highlight.js/lib/languages/xml'
import javascript from 'highlight.js/lib/languages/javascript'
import { marked } from 'marked'
import { markedTerminal } from 'marked-terminal'

// Vue
function hljsDefineVue(hljs) {
  return {
    subLanguage: 'xml',
    contains: [
      hljs.COMMENT('<!--', '-->', { relevance: 10 }),
      { begin: /<template>/, end: /<\/template>/, subLanguage: 'xml', excludeBegin: true, excludeEnd: true },
      { begin: /<script(\s+lang=(?:"ts"|'ts'))?>/, end: /<\/script>/, subLanguage: 'javascript', excludeBegin: true, excludeEnd: true },
      { begin: /<style(\s+lang=(?:"scss"|'scss'))?(\s+scoped)?>/, end: /<\/style>/, subLanguage: 'css', excludeBegin: true, excludeEnd: true },
    ],
  }
}

hljs.registerLanguage('xml',    xml)
hljs.registerLanguage('javascript', javascript)
hljs.registerLanguage('vue',    hljsDefineVue)

marked.use(
  markedTerminal(
    {},                     // terminal styling options
    {
      ignoreIllegals: true,
      highlight(code, lang) {
        const language = hljs.getLanguage(lang) ? lang : 'xml'
        return hljs.highlight(code, { language }).value
      }
    }
  )
)

export default str => marked.parse(str)

test:

import markdownFormatter from './lib/markdownFormatter.js';

console.log(markdownFormatter(`
\`\`\`vue

<template>Hello world</template>

\`\`\`

`));

Any ideas?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions