How to set code syntax highlight using angular-marked

Question

I use angular-marked in my website. And I want highlight code in markdown. I read the Readme docs, in the set default options optional section, when I use the code in my project

markedProvider.setOptions({
  gfm: true,
  tables: true,
  highlight: function (code) {
    return hljs.highlightAuto(code).value;
  }
});

and I have added highlight.js and .css references, according the Highlight.js doc

but Jshint complain 'hljs' not defined. Please help me, how to fix this?

Answer 1

have you include the highlight js file before setOptions ?

Here is my code (using requirejs and angularAMD)

define([
    'app',
    'hljs',
    'services/srv.post',
    'angular-marked'
], function (app, hljs) {
    app.config(['markedProvider', function(markedProvider) {
        markedProvider.setOptions({
            gfm: true,
            tables: true,
            highlight: function (code, lang, callback) {
                return hljs.highlightAuto(code).value;
            }
        });
    }]);
});

Answer 2

I believe hljs is already been imported after you added the highlight.js. The problem you have is the jshint detect the hljs is not defined within the current file, but after browser load every script, the hljs will be available. You can suppress this alarm in the jshintrc by adding "globals": { "hdls": false, }