javascript - highlight.js怎么修改高亮风格?

 李玲玉1990020292 发布于 2022-11-20 07:02

最近在做一个Markdown编辑器给自己用,基于nw.js
想添加代码高亮功能,用的是highlight.js。
在index.html中加入css文件(hybrid.css放在index.html上一层的css文件夹中),代码如下:

editor.js中的代码如下:

exports.reload = function(){
    var marked = require("marked");
    var hljs = require("highlight.js?1.2.1");
    marked.setOptions({
    renderer: new marked.Renderer(),
        gfm: true,
        tables: true,
        breaks: false,
        pedantic: false,
        sanitize: false,
        smartLists: true,
        smartypants: false,
        highlight:function(code){return hljs.highlightAuto(code).value;}
    });
    var resultp = global.$('.md_result');
    var textEditor = global.$('#editor');
    var text = textEditor.val();
    resultp.html(marked(text));
};

关键代码是:

var hljs = require("highlight.js?1.2.1");
highlight:function(code){return hljs.highlightAuto(code).value;}

这个可以用,但是渲染效果不是hybrid.css的风格,而是默认的格式。

PS: markdown基础程序基于Node Webkit (NW.js) tutorial: creating a Markdown editor

请问怎么做才能用到hybrid.css?
谢谢!!

3 个回答
  • 这种的require("highlight.js?1.2.1")
    require是几版本?
    为什么我看到的require都是require(['highlight'],function(highlight){

    })这种形式的?

    2022-11-20 08:24 回答
  • 修改或者替换css就好了

    或者用源码里面提供的
    https://github.com/isagalaev/highlight.js/tree/master/src/styles

    2022-11-20 08:24 回答
  • highlight.js 做的事情就是解析语法然后标上一些 class,样式部分全在 css。
    所以你觉得样式问题可以先看看 css 是否引入成功,然后看看那些关键字什么的对应的样式是否是来自 hybrid.css 那个文件,如果是的话那就是那样的。

    PS: 话说 md 编辑器不是已经有挺多的了么

    2022-11-20 08:24 回答
撰写答案
今天,你开发时遇到什么问题呢?
立即提问
热门标签
PHP1.CN | 中国最专业的PHP中文社区 | PNG素材下载 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有