做了个 JS、CSS 代码格式化高亮的 Chrome 扩展

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

爱意满满的作品展示区。

这是一个创建于 3581 天前的主题，其中的信息可能已经有所发展或是发生改变。

Prism Pretty: https://chrome.google.com/webstore/detail/prism-pretty/hjjcdjnncffbbhlglkipjhljmocnehim

查看页面源码的时候，打开其中的JS、CSS地址，会对其进行格式化并高亮，同时支持JSON、JSONP请求。然后高亮用的Prism.js，CSS属性的图形化展示来自dabblet.com。

项目详情： https://github.com/L3au/prism-pretty

第 1 条附言 · 2015-02-27 16:25:10 +08:00

- 性能提升
- 修正JSON、JSONP格式bug
- 右键中增加“格式化页面源码”选项

第 2 条附言 · 2015-03-09 22:14:24 +08:00

v1.10.0
- 增加markdown文件预览
- 增加格式化配型配置
- 增加默认Droid Sans Mono字体
- 一些bug修复

欢迎更新！

第 3 条附言 · 2015-03-24 21:00:54 +08:00

！！！很重要！！！
v1.11.4
- 修改了请求头和内容获取方式，扩展里不会再有额外的请求
- 这个问题某些情况下比较严重，具体见https://www.v2ex.com/t/164225#r_1920686

已修改发布
https://chrome.google.com/webstore/detail/prism-pretty/hjjcdjnncffbbhlglkipjhljmocnehim

CSS

格式化

prism.js

36 条回复 • 2018-12-26 22:18:38 +08:00

lx19930805

2015-01-21 20:43:29 +08:00

请问BugFree（自动除虫）是什么意思？
不错支持。可惜不支持审查元素，毕竟有时候有些js或者css不能单独打开。

发现个问题，有些页面在读取或者返回结果后会被格式化

flyingfz

2015-01-21 22:21:50 +08:00

good。
提一个建议：
有时候服务器端返回的json，包含一些中文，但是中文是类似："\u79fb\u52a8\u4e92\u8054\u7f51"
建议能把这个转换成汉字。

MaiCong

2015-01-21 23:53:54 +08:00 via iPhone

呃，我也做了一个这种插件。http://www.yuxiaoxi.com/2014-08-26-iformattool.html 没有帐号目前还没有提交到webstore

L3au

2015-01-22 00:19:41 +08:00 via iPad

@lx19930805 额，这个仅供娱乐233。 chrome开发工具里的source本身有格式化高亮的。。可能有误判，可以提供下链接吗？

L3au

2015-01-22 00:19:50 +08:00 via iPad

@flyingfz 哦，这个有的，开启unicode这个选项就可以了

L3au

2015-01-22 00:24:47 +08:00 via iPad

@MaiCong 嗯，也挺好。webstore要5刀的入门费。。记得最早是不用的

lx19930805

2015-01-22 00:34:56 +08:00

@L3au 仅供娱乐？越来越想知道是什么了。v2dn.com 里的邀请码输错后（……/code.post.php）就会误判，应该是返回刷新页面后误判的。

MaiCong

2015-01-22 00:34:58 +08:00 via iPhone

@L3au 要绑定谷歌钱包才给开通，可是没有海外信用卡。

kawaiiushio

2015-01-22 06:56:52 +08:00

chrome:// *.css
chrome-extension://*.css
https://chrome.google.com/*.css（其他https的css文件正常）

这几种url无效

L3au

2015-01-22 10:08:04 +08:00

@lx19930805 这个请求返回的应该是json数据，也会被格式化的

L3au

2015-01-22 10:09:34 +08:00

@MaiCong 办个双币信用卡就好了，很方便的

L3au

2015-01-22 10:09:42 +08:00

@kawaiiushio 这种地址无能为力了，chrome扩展不允许往chrome开头的协议和chrome.google.com这个域名下插入content scripts，应该是出于google自身安全考虑，data:这种dataURI协议也不行。。如data:application/javascript;charset=utf-8,var a = 233

lx19930805

2015-01-23 00:05:03 +08:00

@L3au 发现有些网页源代码不能完全格式化。比如http://dwz.cn/Aw5Ld 或者http://dwz.cn/Aw5Or

jinzhe

2015-01-23 12:26:35 +08:00

很好用！提高了生产力

L3au

2015-01-23 13:41:38 +08:00

@lx19930805 你是说view-source打开的页面源码吗，这个也处理不了。。浏览器默认的有代码高亮了，只是有些页面是压缩的，不方便看。有考虑在当前页面地址上加一个参数，然后格式化高亮源码。

lx19930805

2015-01-23 16:13:23 +08:00

@L3au 那就直接做成，右键“格式化源码”。我记得EditThisCookie能做到添加到developer tools里，要不就添加到扩展的“选项”页面？

L3au

2015-01-27 21:07:58 +08:00

@lx19930805 ok，已增加，更新到1.0.7

lx19930805

2015-01-28 21:43:17 +08:00

@L3au 发现更新后，有个BUG。试了几个SS分享的网站，每次一进入节点配置界面就是无限读取，进不了格式化页面

L3au

2015-01-30 10:12:42 +08:00

@lx19930805 嗯，是有些页面不允许通过ajax获取内容，然后就一直loading，暂时不处理这种页面了。。

sqrtthree

2015-03-03 22:36:50 +08:00

Chrome for mac 环境。版本号：40.0.2214.115，使用你的测试地址http://ip.taobao.com/service/getIpInfo.php?ip=225.5.5.5 也是无效的。。。

L3au

2015-03-04 19:25:24 +08:00

@sqrtthree 是用的1.0.8版本么，我mac下ok的

az123465

2015-03-23 16:41:50 +08:00

不知道怎么搞的只要启用该拓展本站的帖子 “加入收藏”和“取消收藏”按钮的功能就失效了是我自己的原因还是拓展的原因反正我换了台电脑也这样

L3au

2015-03-24 20:55:52 +08:00

@az123465 感谢反馈！的确是扩展的问题，之前为了获取请求头和内容会多出一次请求，而这可能引起一些潜在的问题，就像你看到的收藏功能失效，其实相当于点了两次。。目前已修改发布，通过其他方式获取。非常抱歉，再次感谢！

lx19930805

2015-04-08 20:52:42 +08:00

@L3au 貌似右键的html格式化源码失效了，点了无反应

lx19930805

2015-04-08 20:55:08 +08:00

@lx19930805 原来还要等上一阵刷新才行

suikator

2015-05-08 20:31:30 +08:00

反馈：

![](

)

L3au

2015-05-08 21:28:39 +08:00

@suikator 是为了修改githubusercontent.com的csp设置使之能正常加载loading图片来着，对Prism Pretty也不是什么大问题，刚更新了去掉了这个处理

shishen10

2015-05-12 14:32:09 +08:00

@L3au 可否出逃firefox版本？

shishen10

2015-05-12 14:38:43 +08:00

@shishen10 @L3au 打错字，逃=套

MarshallChen

2015-05-31 13:48:40 +08:00

Too large file... 还有大小限制吗？

MarshallChen

2015-05-31 13:49:06 +08:00

不过确实很漂亮，well done thanks

good

2015-08-30 14:42:16 +08:00

好东西一直在用

fazero

2016-04-26 12:00:10 +08:00

太好用了正是我需要的谢谢

Heanes

2017-11-06 10:57:43 +08:00

这个不错，感谢

ocian

2017-11-14 11:58:51 +08:00

可以在 GitHub 放打包好的的插件吗，公司的网络对这个下载链接很不友好，在 GitHub 放一个可以直接装的会方便一点，而且我也不知道要怎么把这个打包成 .crx 文件，help ！

lx19930805

2018-12-26 22:18:38 +08:00