I cannot get a colored code with docsify?

Question

I am using docsify to build a documentation for my API. However when I insert code block (especially json) the code is written in black.

I don't know how to change it.

Any suggestion ?

Answer 1

Docsify uses Prism for syntax highlighting as explained in the Documentation.

To add support for a specific language you need to add the matching grammar file as so :

<!-- Loading Docsify -->
<script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script>
<!-- Adding json syntax highlighting -->
<script src="//cdn.jsdelivr.net/npm/[email protected]/components/prism-json.min.js"></script>

If you want to browse the list of grammar files available you can browse them here : PrismJS on Github

Answer 2

What worked for me, at least for PHP, was to make sure the language files were included before the main prism library.

  <script src="//cdn.jsdelivr.net/npm/docsify@4"></script>
  <script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-bash.min.js"></script>
  <script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-php.min.js"></script>
  <script src="//cdn.jsdelivr.net/npm/[email protected]/prism.min.js"></script>