1 | [English](./README.md) | 简体中文
|
2 |
|
3 | vConsole
|
4 | ==============================
|
5 | [![npm version](https://badge.fury.io/js/vconsole.svg)](https://badge.fury.io/js/vconsole)
|
6 |
|
7 | 一个轻量、可拓展、针对手机网页的前端开发者调试面板。
|
8 |
|
9 |
|
10 | ## 特性
|
11 |
|
12 | - 查看 console 日志
|
13 | - 查看网络请求
|
14 | - 手动执行 JS 命令行
|
15 | - 自定义插件
|
16 |
|
17 |
|
18 | ## 上手
|
19 |
|
20 | 下载 vConsole 的[最新版本](https://github.com/WechatFE/vConsole/releases/latest)。(不要直接下载 dev 分支下的 `dist/vconsole.min.js`)
|
21 |
|
22 | 或者使用 npm 安装:
|
23 |
|
24 | ```
|
25 | npm install vconsole
|
26 | ```
|
27 |
|
28 | 引入 `dist/vconsole.min.js` 到项目中:
|
29 |
|
30 | ```html
|
31 | <script src="path/to/vconsole.min.js"></script>
|
32 | <script>
|
33 | console.log('Hello world');
|
34 | // 然后点击右下角 vConsole 按钮即可查看到 log
|
35 | </script>
|
36 | ```
|
37 |
|
38 | 详细使用方法请参阅[使用教程](./doc/tutorial_CN.md)。
|
39 |
|
40 |
|
41 | ## 手机预览
|
42 |
|
43 | ![](./example/snapshot/qrcode.png)
|
44 |
|
45 | [http://wechatfe.github.io/vconsole/demo.html](http://wechatfe.github.io/vconsole/demo.html)
|
46 |
|
47 | ![](./example/snapshot/log_panel.png)
|
48 |
|
49 |
|
50 |
|
51 | ## 文档
|
52 |
|
53 |
|
54 | vConsole 本体:
|
55 |
|
56 | - [使用教程](./doc/tutorial_CN.md)
|
57 | - [公共属性及方法](./doc/public_properties_methods_CN.md)
|
58 | - [辅助函数](./doc/helper_functions_CN.md)
|
59 |
|
60 | 插件:
|
61 |
|
62 | - [插件:入门](./doc/plugin_getting_started_CN.md)
|
63 | - [插件:编写插件](./doc/plugin_building_a_plugin_CN.md)
|
64 | - [插件:Event 事件列表](./doc/plugin_event_list_CN.md)
|
65 |
|
66 |
|
67 |
|
68 | ## 插件列表
|
69 |
|
70 | - [vConsole-resources](https://github.com/WechatFE/vConsole-resources)
|
71 | - [vConsole-sources](https://github.com/WechatFE/vConsole-sources)
|
72 |
|
73 |
|
74 |
|
75 | ## 更新记录
|
76 |
|
77 | [CHANGELOG_CN.md](./CHANGELOG_CN.md)
|
78 |
|
79 |
|
80 | ## License
|
81 |
|
82 | The MIT License (http://opensource.org/licenses/MIT)
|