Angular-marked中添加代码高亮

折腾

Angular-marked中大致说了一下添加代码高亮的方法，总结起来就是如下代码：

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

按照说明，把Highlight.js的css和js文件引用进来：

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.3/styles/default.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.3/highlight.min.js"></script>

设置好之后，运行时，jshint总是提示hljs未定义，编译都通不过。

分析一下，确实从上下文中找不到hljs的定义，hljs是highlight.min.js中定义的，是一个全局的变量。但是AngluarJS是使用依赖注入的机制，而且这是搜索AngluarJS的module，而hljs只是一个普通的js类。

所以我想找一个封装好成AngularJS模块的Highlight.js版本，找到了angular-highlightjs，这个看起来并不是我想要的，不知道怎么套到上面的代码中。

后来我在代码中强行忽略找不到hljs的错误，也就是加上/* jshint ignore:start/end*/，竟然可以正常运行了。下面贴一个效果：

效果如下：

#include <iostream>

int main(int argc, char *argv[]) {

  /* An annoying "Hello World" example */
  for (auto i = 0; i < 0xFFFF; i++)
  cout << "Hello, World!" << endl;

  char c = '\n';
  unordered_map <string, vector<string> > m;
  m["key"] = "\\\\"; // this is an error

  return -2e3 + 12l;
}

后记

虽然花了好多时间，完全没有头绪，最后这样强行忽略错误，也是无奈，相信会有更正确的解决方法。所以我在StackOverflow上问了一个这个问题，希望能得到大神的解答，链接