blocks|key|4674080|text|可以通过Package+Control和Github查看Sublime+Text的Neon+Color+Scheme。关键点和值以不同的颜色高亮显示，并且不同级别有不同的关键点颜色。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4674081|​|4674082|📷|atomic|4674083|4674084|完全公开:我是这个项目的维护者，但我真的认为它会对您有所帮助-它在处理像上面所示的多级JSON文件时肯定会对我有帮助。|4674085|entityMap|0|LINK|mutability|MUTABLE|url|https://sublime.wbond.net/|1|https://github.com/MattDMo/Neon-color-scheme|2|https://sublime.wbond.net/packages/Neon%2520Color%2520Scheme|3|IMAGE|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/2828a07c9cc09d75f7f926615fe9480a.png|imageAlt^0|4|F|0|K|6|1|15|H|2|0|0|0|1|3|0|0|0^^$0|@$1|2|3|4|5|6|7|13|8|@]|9|@$A|14|B|15|1|16]|$A|17|B|18|1|19]|$A|1A|B|1B|1|1C]]|C|$]]|$1|D|3|E|5|6|7|1D|8|@]|9|@]|C|$]]|$1|F|3|G|5|H|7|1E|8|@]|9|@$A|1F|B|1G|1|1H]]|C|$]]|$1|I|3|E|5|6|7|1I|8|@]|9|@]|C|$]]|$1|J|3|K|5|6|7|1J|8|@]|9|@]|C|$]]|$1|L|3|-4|5|6|7|1K|8|@]|9|@]|C|$]]]|M|$N|$5|O|P|Q|C|$R|S]]|T|$5|O|P|Q|C|$R|U]]|V|$5|O|P|Q|C|$R|W]]|X|$5|Y|P|Z|C|$10|11|12|-4]]]]

Check out the <a href="https://sublime.wbond.net/packages/Neon%20Color%20Scheme" rel="noreferrer">Neon Color Scheme</a>, available via <a href="https://sublime.wbond.net" rel="noreferrer">Package Control</a> and <a href="https://github.com/MattDMo/Neon-color-scheme" rel="noreferrer">Github</a> for Sublime Text. Keys and values are highlighted in different colors, and there are different key colors for different levels. 

<img src="https://i.stack.imgur.com/cToey.png" alt="JSON with Neon">

Full disclosure: I'm the maintainer for this project, but I really think it'll help you out - it certainly helps me when working with multi-leveled JSON files like the one shown above.

blocks|key|4674139|text|如果你喜欢默认的Monkai主题，请查看MonokaiJSON%2B主题！它支持字符串、字典、数组以及所有这些的混合！|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4674140|https://github.com/ColibriApps/MonokaiJsonPlus|offset|length|4674141|​|4674142|📷|atomic|4674143|4674144|entityMap|0|LINK|mutability|MUTABLE|url|1|IMAGE|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/04d3049d7384420e54c77f4b141625a7.png|imageAlt^0|0|0|1A|0|0|0|0|1|1|0|0^^$0|@$1|2|3|4|5|6|7|Y|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|Z|8|@]|9|@$D|10|E|11|1|12]]|A|$]]|$1|F|3|G|5|6|7|13|8|@]|9|@]|A|$]]|$1|H|3|I|5|J|7|14|8|@]|9|@$D|15|E|16|1|17]]|A|$]]|$1|K|3|G|5|6|7|18|8|@]|9|@]|A|$]]|$1|L|3|-4|5|6|7|19|8|@]|9|@]|A|$]]]|M|$N|$5|O|P|Q|A|$R|C]]|S|$5|T|P|U|A|$V|W|X|-4]]]]

If you like the default Monkai Theme, check out MonokaiJSON+ Theme!
It supports strings, dictionaries, arrays and all of these mixed as well!

<a href="https://github.com/ColibriApps/MonokaiJsonPlus" rel="nofollow noreferrer">https://github.com/ColibriApps/MonokaiJsonPlus</a>

<img src="https://i.stack.imgur.com/fitPZ.png" alt="Monokai JSON+ Theme">

blocks|key|168296|text|我修改了原来的黄昏主题，为更漂亮的json添加了规则。这是@MattDMo答案的修改版本，不同级别有相似的不同键颜色。你可以从这里获得它|type|unstyled|depth|inlineStyleRanges|entityRanges|data|168297|https://github.com/shaunakv1/twilight-tmTheme-better-json-highlight|offset|length|168298|下面是JSON的外观：|168299|​|168300|📷|atomic|168301|168302|entityMap|0|LINK|mutability|MUTABLE|url|1|IMAGE|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/2ebc834995268479a0ac0be3d16f29bb.png|imageAlt^0|0|0|1V|0|0|0|0|0|1|1|0|0^^$0|@$1|2|3|4|5|6|7|10|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|11|8|@]|9|@$D|12|E|13|1|14]]|A|$]]|$1|F|3|G|5|6|7|15|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|16|8|@]|9|@]|A|$]]|$1|J|3|K|5|L|7|17|8|@]|9|@$D|18|E|19|1|1A]]|A|$]]|$1|M|3|I|5|6|7|1B|8|@]|9|@]|A|$]]|$1|N|3|-4|5|6|7|1C|8|@]|9|@]|A|$]]]|O|$P|$5|Q|R|S|A|$T|C]]|U|$5|V|R|W|A|$X|Y|Z|-4]]]]

I modified original twilight theme to add rules for prettier json. It's a modified version of @MattDMo 's answer, and has the similar different key colors for different levels. You can get it from here

<a href="https://github.com/shaunakv1/twilight-tmTheme-better-json-highlight" rel="nofollow noreferrer">https://github.com/shaunakv1/twilight-tmTheme-better-json-highlight</a> 

Here's how JSON looks:

<img src="https://i.stack.imgur.com/1UKoz.png" alt="enter image description here">

blocks|key|4674252|text|您会发现https://jsonlog.io/是一种解决方案，它为应用程序的结构化数据IO提供了很好的可见性。我是这个项目背后的开发人员，但它是我在自己的工作流程中为解决这个问题而构建的免费资源。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4674253|以下是一种可能有帮助的日志格式的示例：|4674254|JSONLog+Pretty+Log+View|4674255|由于它是实时日志记录类型的平台，因此数据在从您的应用程序发送时实时显示。这是一种深入了解实时/开发应用程序IO的好方法。|4674256|entityMap|0|LINK|mutability|MUTABLE|url|https://jsonlog.io/|1|https://i.stack.imgur.com/gcbUj.png^0|4|J|0|0|0|0|N|1|0|0^^$0|@$1|2|3|4|5|6|7|T|8|@]|9|@$A|U|B|V|1|W]]|C|$]]|$1|D|3|E|5|6|7|X|8|@]|9|@]|C|$]]|$1|F|3|G|5|6|7|Y|8|@]|9|@$A|Z|B|10|1|11]]|C|$]]|$1|H|3|I|5|6|7|12|8|@]|9|@]|C|$]]|$1|J|3|-4|5|6|7|13|8|@]|9|@]|C|$]]]|K|$L|$5|M|N|O|C|$P|Q]]|R|$5|M|N|O|C|$P|S]]]]

You'll find that <a href="https://jsonlog.io/" rel="nofollow noreferrer">https://jsonlog.io/</a> is a solution that provides great visibility into your application's structured data IO. I'm the developer behind this, but it's a free resource I built to solve this exact issue in my own workflow. 

Here's an example of one of the log formats that might help:

<a href="https://i.stack.imgur.com/gcbUj.png" rel="nofollow noreferrer">JSONLog Pretty Log View</a>

And since it's a live logging-type platform the data displays live as they are sent from your application. It's a great way to get insight into your live/dev application IO.

blocks|key|4674274|text|我开发了一个命令行工具来查看json日志(参见https://github.com/qiangyt/jog)。它就像'tail+-f日志文件‘，但它是用于json日志的。|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4674275|它是用GO编写的，所以它是跨平台的。这些二进制文件可以通过https://github.com/qiangyt/jog/releases下载。|4674276|没有记录如何很好地配置它，但它在默认情况下工作正常，我很高兴得到问题报告或新功能请求|4674277|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/qiangyt/jog|1|https://github.com/qiangyt/jog/releases^0|N|U|0|0|T|13|1|0|0^^$0|@$1|2|3|4|5|6|7|R|8|@]|9|@$A|S|B|T|1|U]]|C|$]]|$1|D|3|E|5|6|7|V|8|@]|9|@$A|W|B|X|1|Y]]|C|$]]|$1|F|3|G|5|6|7|Z|8|@]|9|@]|C|$]]|$1|H|3|-4|5|6|7|10|8|@]|9|@]|C|$]]]|I|$J|$5|K|L|M|C|$N|O]]|P|$5|K|L|M|C|$N|Q]]]]

I developed a command line tool to view json log (see <a href="https://github.com/qiangyt/jog" rel="nofollow noreferrer">https://github.com/qiangyt/jog</a>). It is just like 'tail -f log-file' but it's for json log.
It's written using GO so it's cross-platform. The binaries are downloadable via <a href="https://github.com/qiangyt/jog/releases" rel="nofollow noreferrer">https://github.com/qiangyt/jog/releases</a>.
Not document how to configure it very well, but it works properly by default,and I'm happy to get issue report or new feature request

blocks|key|168118|text|查看SublimeText中的json文件，我意识到键和值具有不同的作用域。因此，定制您的配色方案并为键和值添加不同的颜色应该是非常简单的。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|168119|键的作用域为source.json+meta.structure.dictionary.json+string.quoted.double.json，而值的作用域为source.json+meta.structure.dictionary.json+meta.structure.dictionary.value.json+string.quoted.double.json|offset|length|style|CODE|168120|因此，如果您在配色方案规则的底部添加此代码片段，您应该会看到它们具有不同的颜色：|168121|++++<dict>
++++++++<key>name</key>
++++++++<string>Json+Keys</string>
++++++++<key>scope</key>
++++++++<string>source.json+meta.structure.dictionary.json+string.quoted.double.json</string>
++++++++<key>settings</key>
++++++++<dict>
++++++++++++<key>foreground</key>
++++++++++++<string>#FF0000</string>+
++++++++</dict>
++++</dict>
++++<dict>
++++++++<key>name</key>
++++++++<string>JSON+Values</string>
++++++++<key>scope</key>
++++++++<string>source.json+meta.structure.dictionary.json+meta.structure.dictionary.value.json+string.quoted.double.json</string>
++++++++<key>settings</key>
++++++++<dict>
++++++++++++<key>foreground</key>
++++++++++++<string>#00FF00</string>+
++++++++</dict>
++++</dict>|code-block|syntax|javascript|168122|entityMap^0|0|6|1W|2A|2X|0|0|0^^$0|@$1|2|3|4|5|6|7|Q|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|R|8|@$D|S|E|T|F|G]|$D|U|E|V|F|G]]|9|@]|A|$]]|$1|H|3|I|5|6|7|W|8|@]|9|@]|A|$]]|$1|J|3|K|5|L|7|X|8|@]|9|@]|A|$M|N]]|$1|O|3|-4|5|6|7|Y|8|@]|9|@]|A|$]]]|P|$]]

looking at a json file in SublimeText, I realised keys and values have different scopes. so it should be very trivial to customize your color scheme and add different color for keys and values.

keys have scope of <code>source.json meta.structure.dictionary.json string.quoted.double.json
</code> while values have <code>source.json meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json</code>

so if you add this snippet at the bottom of you color scheme rules you should see them in different colors:

<pre><code> &lt;dict&gt;
 &lt;key&gt;name&lt;/key&gt;
 &lt;string&gt;Json Keys&lt;/string&gt;
 &lt;key&gt;scope&lt;/key&gt;
 &lt;string&gt;source.json meta.structure.dictionary.json string.quoted.double.json&lt;/string&gt;
 &lt;key&gt;settings&lt;/key&gt;
 &lt;dict&gt;
 &lt;key&gt;foreground&lt;/key&gt;
 &lt;string&gt;#FF0000&lt;/string&gt; &lt;!-- your keys color --&gt;
 &lt;/dict&gt;
 &lt;/dict&gt;
 &lt;dict&gt;
 &lt;key&gt;name&lt;/key&gt;
 &lt;string&gt;JSON Values&lt;/string&gt;
 &lt;key&gt;scope&lt;/key&gt;
 &lt;string&gt;source.json meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json&lt;/string&gt;
 &lt;key&gt;settings&lt;/key&gt;
 &lt;dict&gt;
 &lt;key&gt;foreground&lt;/key&gt;
 &lt;string&gt;#00FF00&lt;/string&gt; &lt;!-- your custom color --&gt;
 &lt;/dict&gt;
 &lt;/dict&gt;
</code></pre>

blocks|key|168501|text|如果你想在控制台可视化winston+json日志，你可以使用munia-pretty-json|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|168502|您的json数据(app-log.json)|168503|{"time":"2021-06-09T02:50:22Z","level":"info","message":"Log+for+pretty+JSON","module":"init","hostip":"192.168.0.138","pid":123}
{"time":"2021-06-09T03:27:43Z","level":"warn","message":"Here+is+warning+message","module":"send-message","hostip":"192.168.0.138","pid":123}|code-block|syntax|javascript|168504|运行以下命令：|168505|munia-pretty-json+app-log.json|168506|以下是控制台上的可读输出：|168507|​|168508|📷|atomic|168509|168510|您可以使用模板格式化输出。默认模板为'{time}+{level+-c}+{message}'|style|CODE|168511|使用模板：|168512|munia-pretty-json+-t+'{module+-c}+-+{level}+-+{message}'+app-log.json|168513|输出：|168514|168515|168516|entityMap|0|LINK|mutability|MUTABLE|url|https://github.com/gagan-bansal/munia-pretty-json|1|IMAGE|IMMUTABLE|imageUrl|https://ask.qcloudimg.com/http-save/yehe-900000/bec63fd1fac0da1c883c779c73ff786c.png|imageAlt|2|https://ask.qcloudimg.com/http-save/yehe-900000/78c1858c171d9750f33c44d0eecec376.png^0|V|H|0|0|0|0|0|0|0|0|0|1|1|0|0|I|T|0|0|0|0|0|1|2|0|0^^$0|@$1|2|3|4|5|6|7|1O|8|@]|9|@$A|1P|B|1Q|1|1R]]|C|$]]|$1|D|3|E|5|6|7|1S|8|@]|9|@]|C|$]]|$1|F|3|G|5|H|7|1T|8|@]|9|@]|C|$I|J]]|$1|K|3|L|5|6|7|1U|8|@]|9|@]|C|$]]|$1|M|3|N|5|H|7|1V|8|@]|9|@]|C|$I|J]]|$1|O|3|P|5|6|7|1W|8|@]|9|@]|C|$]]|$1|Q|3|R|5|6|7|1X|8|@]|9|@]|C|$]]|$1|S|3|T|5|U|7|1Y|8|@]|9|@$A|1Z|B|20|1|21]]|C|$]]|$1|V|3|R|5|6|7|22|8|@]|9|@]|C|$]]|$1|W|3|X|5|6|7|23|8|@$A|24|B|25|Y|Z]]|9|@]|C|$]]|$1|10|3|11|5|6|7|26|8|@]|9|@]|C|$]]|$1|12|3|13|5|H|7|27|8|@]|9|@]|C|$I|J]]|$1|14|3|15|5|6|7|28|8|@]|9|@]|C|$]]|$1|16|3|T|5|U|7|29|8|@]|9|@$A|2A|B|2B|1|2C]]|C|$]]|$1|17|3|R|5|6|7|2D|8|@]|9|@]|C|$]]|$1|18|3|-4|5|6|7|2E|8|@]|9|@]|C|$]]]|19|$1A|$5|1B|1C|1D|C|$1E|1F]]|1G|$5|1H|1C|1I|C|$1J|1K|1L|-4]]|1M|$5|1H|1C|1I|C|$1J|1N|1L|-4]]]]

If you want to visualize winston json log at console you can use <a href="https://github.com/gagan-bansal/munia-pretty-json" rel="nofollow noreferrer">munia-pretty-json</a>
Your json data (app-log.json)
<pre class="lang-none prettyprint-override"><code>{&quot;time&quot;:&quot;2021-06-09T02:50:22Z&quot;,&quot;level&quot;:&quot;info&quot;,&quot;message&quot;:&quot;Log for pretty JSON&quot;,&quot;module&quot;:&quot;init&quot;,&quot;hostip&quot;:&quot;192.168.0.138&quot;,&quot;pid&quot;:123}
{&quot;time&quot;:&quot;2021-06-09T03:27:43Z&quot;,&quot;level&quot;:&quot;warn&quot;,&quot;message&quot;:&quot;Here is warning message&quot;,&quot;module&quot;:&quot;send-message&quot;,&quot;hostip&quot;:&quot;192.168.0.138&quot;,&quot;pid&quot;:123}
</code></pre>
Run the command:
<pre class="lang-none prettyprint-override"><code>munia-pretty-json app-log.json
</code></pre>
Here is readable output on console:
<a href="https://i.stack.imgur.com/RNram.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/RNram.png" alt="enter image description here" /></a>
You can format the output with the template. The default template is <code>'{time} {level -c} {message}'</code>
Using template:
<pre class="lang-none prettyprint-override"><code>munia-pretty-json -t '{module -c} - {level} - {message}' app-log.json
</code></pre>
Output:
<a href="https://i.stack.imgur.com/2DrfJ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/2DrfJ.png" alt="enter image description here" /></a>

Using <a href="https://github.com/flatiron/winston">winston</a> for node.js logging, I get json log files. A log file in this vein is simply a sequence of (newline delimited) json objects. This is great for log querying and treating logs as first-class data!

However, both <code>Sublime</code> and <code>gedit</code> (at least the versions of them I'm using on Ubuntu, sublime 2 and gedit 3.6.2), poorly highlight json - they use the same color for keys and values, making any log drilling quite painful and really impossible to go through in any remotely humane manner.

Existing <code>chrome extensions</code> for json highlighting aren't helpful here either - they can't handle a collection of json objects and thus fail displaying these log files unless I manually turn them into an array within a synthetic parent object first (thus turning them into a json object). This is tedious in the case of viewing a log file that is still being written to and in general......

Is there any tool that can both swallow json log files as is, and at the same time highlight keys in a different color than values, so that json logs are also friendly to man, not only to machine?? this is a real pain.

Thanks!

Much needed: well-highlighted JSON log viewer

命令行工具

结构化数据

日志文件

Ubuntu

JSON

使用进行node.js日志记录，我得到了json日志文件。这样的日志文件只是一系列(换行符分隔的) json对象。这对于日志查询和将日志视为一级数据非常有用！然而，Sublime和gedit (至少是我在Ubuntu，sublime 2和gedit 3.6.2上使用的版本)都不太突出json -它们使用相同的键和值的颜色，使得任何日志钻取都非常痛苦，并且真的不可能以任何远程人性化的方式进行。jso

问非常需要:突出显示的JSON日志查看器
EN

回答 7

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问非常需要:突出显示的JSON日志查看器EN

回答 7

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问非常需要:突出显示的JSON日志查看器
EN