Skip to content

Provide the ability to add additional-js files above book.js in index.html (to support custom language highlights) #1870

Closed
@SomeRanDev

Description

@SomeRanDev

At the current moment, one can add additional js files to be added to the generated index.html using the book.toml configuration (issue that inspired this):

[output.html]
additional-js = ["custom.js"]

The provided js files are placed at the bottom of the index.html:

...
<script src="clipboard.min.js" type="text/javascript" charset="utf-8"></script>
<script src="highlight.js" type="text/javascript" charset="utf-8"></script>
<script src="book.js" type="text/javascript" charset="utf-8"></script>

<!-- Custom JS scripts -->
<script type="text/javascript" src="custom.js"></script>

However, I am having an issue using highlight.js's ability to add custom languages due to the placement of these custom js scripts. hljs.registerLanguage works too late by running after book.js, because by that point (from what I can gather), it has already attempted to generate a code block using my language's id. This creates an error with highlight.js since the language has not been defined, so it defaults to plain text color. Simply placing the custom.js script above the book.js script makes everything work perfectly.

This isn't that big of a deal, as I can simply modify the index.html post build, but it would be nice if I could see color while developing using serve. Especially since using mdBook to document new programming languages (I would imagine) could be a pretty big use-case due to how amazing it looks with Rust, I feel adding a solution to this problem would be nice.

An alternative solution could be the ability to provide a custom version of highlight.js? Maybe this is already possible, but I haven't been able to find it. That would allow one to simply append the extra language registers to the bottom of the file and use it over the one mdBook provides.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions