编写语法荧光笔

Posted

技术标签:

【中文标题】编写语法荧光笔【英文标题】:Writing a syntax highlighter 【发布时间】:2010-10-23 00:07:45 【问题描述】:

我希望为我正在考虑从事的暑期项目编写自己的语法荧光笔,但我不知道如何编写自己的语法荧光笔。

我知道那里有很多实现,但我想了解正则表达式以及语法突出显示的工作原理。

语法高亮是如何工作的,有哪些很好的参考来开发一个?语法高亮是在输入每个字符时扫描它,还是在输入每个字符后扫描整个文档/文本区域?

任何见解将不胜感激。

谢谢。

PS:我本来打算用 ActionScript 来写的

【问题讨论】:

【参考方案1】:

Udacity course CS262 是解决此问题的一种方法的良好开端。标题是构建一个 Web 浏览器,但该课程真正关注的是您正在寻找的问题 - 如何解析和 lex 一组文本。在您的情况下,您将使用该信息进行突出显示。我刚拿了它,它非常好。课程现已“结束”,但视频和练习题/家庭作业仍在播放中,可供观看。

【讨论】:

链接已失效。 @BarbaraKwarc 链接对我来说并没有死,但课程是:?【参考方案2】:

语法荧光笔可以以两种非常通用的方式工作。第一个为突出显示的语言实现完整的词法分析器和解析器,准确识别每个标记的类型(关键字、类名、实例名、变量类型、预处理器指令......)。这提供了根据某些规范准确突出显示代码所需的所有信息(红色的关键字,蓝色的类名,你有什么)。

第二种方式类似于Google Code Prettify 采用的方式,不是为每种语言实现一个词法分析器/解析器,而是使用了几个非常通用的解析器,它们可以在大多数语法上做得不错。例如,这个荧光笔将能够很好地解析和突出任何类 C 语言,因为它的词法分析器/解析器可以识别这些语言的一般组件。

这还有一个优点,因此,您不需要明确指定语言,因为引擎将自行确定哪个通用解析器可以做得最好。当然,缺点是突出显示不如使用特定语言的解析器完美。

【讨论】:

你开始说荧光笔有两种一般的作用方式,但除非我误解了,否则你没有解释第二种方式。 @Marplesoft 据我了解,为每种语言编写词法分析器是第一种方式,编写通用词法分析器是第二种方式。 使用 Trie 数据结构可能会有所帮助【参考方案3】:

构建语法高亮器就是要在代码中找到特定的关键字并赋予它们特定的样式(字体、字体样式、颜色等)。为了实现这一点,您需要定义特定于编写代码的编程语言的关键字列表,然后解析文本(例如使用正则表达式),找到特定的标记并用正确样式的替换它们html 标记。

javascript 编写的一个非常基本的高亮代码如下所示:

var keywords = [ "public", "class", "private", "static", "return", "void" ];
for (var i = 0; i < keywords.length; i++)

        var regex = new RegExp("([^A-z0-9])(" + keywords[i] + ")([^A-z0-9])(?![^<]*>|[^<>]*</)", "g");
        code = code.replace(regex, "$1<span class='rm-code-keyword'>$2</span>$3");

【讨论】:

【参考方案4】:

我前段时间在我的博客上发布了一个SQL代码着色工具: http://gruchalski.com/2009/04/26/flex-textrange-performance-issue-on-linux/

您可以找到指向 sqlcodecoloring.zip 的链接以及源代码。它是使用标记器和 TextRange 类实现的。

另一个链接,作为原型应用程序一部分的 sql 代码着色: http://github.com/radekg/mysqlinterface/tree/master

【讨论】:

【参考方案5】:

不幸的是,我从来没有使用过 Actionscript,所以我无法在这部分提供帮助。

但除此之外,编写语法荧光笔的一个好的开始是查看现有的。例如,vim 具有普通文本文件形式的语法文件,因此您可以先查看这些文件。那里有一堆正则表达式(正则表达式有几种风格,但它们并没有那么不同......),所以对于这一部分,你可能会看一些书。

就个人而言,我发现Beginning regular expressions 是一个不错的人。 Mastering regular expressions 也适用于更高级的科目。另一方面,Regular expressions pocket reference 非常适合确定上述风格的差异,因为它还包含有关 vim 正则表达式的一章。

【讨论】:

【参考方案6】:

在*** podcast number 50Steve Yegge 中谈到了他创建一些通用高亮机制的项目。不是成品,可能比您想要的更复杂,但可能会有一些有趣的东西。

【讨论】:

该播客在链接页面中是否真的可用? @OrestesKappa 似乎不是。只需搜索“The Stack Overflow Podcast”并向下滚动到第 50 集,我就可以在 Google 的 Podcasts 应用程序中找到它。它应该可以从任何播客播放器中获得。【参考方案7】:

如果您解释一下这个语法高亮器的用途可能会有所帮助。如果您是在动作脚本中编写它,您的想法是在 Flash 电影中设置一个文本框并在按下提交按钮后突出显示语法吗?或者您想从某个 Web 服务中读取文本,然后显示突出显示的语法? ...我很难提供帮助,因为我很难想象你在做什么

但是,语法高亮器读取文本,然后将代码行与一些正则表达式进行比较,这有助于语法高亮器找出单词的含义。例如,它可能会将单词“function”或“int”读取为保留字,并将它们替换为 html 文本:

<span class="reserved">function</span>, <span class="reserved"></span>

假设你有css并且想要红色的保留字,

.reserved
  color: #ff0000;

这是基本概念,您可能希望从geshi 中获取想法,因为您可以查看源代码。

【讨论】:

对不起,我没有澄清更多。我计划在 Adob​​e Flex 中实现一个协作文本编辑器。我想要的是有一个 TextArea 或类似的文本输入组件......然后当用户输入时,例如 Java 代码,他们输入的代码将突出显示语法。就像任何带有语法高亮的 IDE。

以上是关于编写语法荧光笔的主要内容,如果未能解决你的问题,请参考以下文章

在 Windows 上为 jekyll 安装 rouge 代码荧光笔

Excel中的条件格式设置总计

Objective C 的 Javascript 语法高亮显示

如何将 python 源代码添加到 libreoffice writer?

如何在 mailchimp 中使用更高级别的 pygments 语法

在 Cucumber 中编写测试定义的正确语法是啥?