在Sublime文本中突出显示JavaScript的字典键 [英] Highlighting JavaScript's dictionary keys in Sublime text

问题描述

能否用Sublime文本获得用JavaScript编写的关联数组的键的特定语法突出显示?

is it possible to get a specific syntax highlight of the keys of the associative arrays written in JavaScript with Sublime text?

以下屏幕快照将说明问题(使用Cobalt主题):

The following screenshot will illustrate the problem (using Cobalt theme):

如您所见，该段代码的语法突出显示效果很差. 我想获得对象键的专用颜色.这可能吗?

As you can see, the syntax highlighting of that piece of code is very poor. I would like to get a dedicated color of the object's keys. Is this possible?

通过点表示法设置对象字段的语法高亮显示也不令人满意:

Syntax highlighting of setting the fields of an object by dot notation is also unsatisfactory:

即使在这种情况下，语法突出显示也非常简单:对象，成员字段和右值都具有相同的颜色.

Even in that case the syntax highlighting is dramatically plain: the object, the member field and the rvalue all have the same color.

我试图编辑主题的XML，但是找不到键是否被真正识别.那么一些基于正则表达式的语法突出显示呢?这可以吗?

I tried to edit the XML of the theme, but could not find if the keys are actually identified. What about some regex-based syntax highlight? Is this available?

推荐答案

查看包装控制获得.与Sublime附带的JavaScript语法相比，它的作用域更多，从而可以更精细地控制语法突出显示.以下是应用了JSN的代码段(配色方案为 Neon ):

Check out the JavaScriptNext - ES6 Syntax language definition, available through Package Control. It has many more scopes than the JavaScript syntax that ships with Sublime, allowing for much finer-grained control of syntax highlighting. Below is your code snippet with JSN applied (the color scheme is Neon):

在query数组中，键的完整范围为constant.other.object.key.js string.unquoted.label.js，而值的范围为variable.other.readwrite.js(两个显然也为source.js).对于exports行，exports是support.keyword.node.js，.add和.get属性是meta.property.js variable.other.property.js，值再次是variable.other.readwrite.js.

In the query array, the full scope for the key is constant.other.object.key.js string.unquoted.label.js, while the scope for the value is variable.other.readwrite.js (both are obviously source.js as well). As for the exports lines, exports is support.keyword.node.js, the .add and .get properties are meta.property.js variable.other.property.js, and the values are again variable.other.readwrite.js.

如果要进行任何颜色方案定制，我强烈建议您使用两种工具.第一个是 ScopeAlways ，可以将其切换为始终在光标下方显示当前范围在状态栏中.另一个是facelessuser的 ColorSchemeEditor ，它提供了用于编辑.tmTheme文件的GUI.您应该能够通过在命令行上的Packages文件夹(通过选择Preferences -> Browse Packages...打开的文件夹)并运行以下命令来安装它(二进制文件将自动下载):

If you're going to be doing any color scheme customization, there are two tools I highly recommend. The first is ScopeAlways, which can be toggled to always show the current scope under the cursor in the status bar. The other is facelessuser's ColorSchemeEditor, which provides a GUI for editing .tmTheme files. You should be able to install it (the binary will be downloaded automatically) by going to your Packages folder on the command line (the folder opened by selecting Preferences -> Browse Packages...) and running the following:

git clone https://github.com/facelessuser/ColorSchemeEditor.git ColorSchemeEditor

重新启动Sublime，并在某些时候提示您下载适用于您平台的二进制文件.如果您想从源代码构建它，或者如果其他方法不起作用，我已经编写了

Restart Sublime, and at some point it will prompt you to download the binary for your platform. If you want to build it from source, or if the other way doesn't work, I've written up a guide here.

祝你好运！

这篇关于在Sublime文本中突出显示JavaScript的字典键的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！