<p><code></p> <p><a href="https://github.com/bigggge/AirLog" rel="nofollow noreferrer" target="_blank">https://github.com/bigggge/Ai...</a></p> <p>基于 WebSocket 和 <a href="http://www.js-code.com/tag/vue" title="Vue" target="_blank">Vue</a> 的前端远程实时 LOG 工具,适用于手机调试和远程调试</p> <ul> <li>远程实时查看和筛选 LOG 信息</li> <li>查看网页性能信息</li> <li>可将 LOG 导出为 JSON 格式的文件</li> </ul> <p><span class="img-wrap"><img data-src="/img/remote/1460000010937674" src="https://static.segmentfault.com/v-5cc2cd8e/global/img/squares.svg" alt="" title="" style="cursor: pointer;"></span></p> <h2 id="articleHeader0">Install</h2> <div class="widget-codetool" style="display:none;"> <div class="widget-codetool--inner"> <span class="selectCode code-tool" data-toggle="tooltip" data-placement="top" title="" data-original-title="全选"></span><br /> <span type="button" class="copyCode code-tool" data-toggle="tooltip" data-placement="top" data-clipboard-text="npm install airlog" title="" data-original-title="复制"></span> </div> </p></div> <pre class="hljs sql"><code style="word-break: break-word; white-space: initial;">npm <span class="hljs-keyword">install</span> airlog</code></pre> <h2 id="articleHeader1">Run</h2> <h3 id="articleHeader2">Server</h3> <p>启动 airlog server , 可自定义端口号,默认为 3000</p> <div class="widget-codetool" style="display:none;"> <div class="widget-codetool--inner"> <span class="selectCode code-tool" data-toggle="tooltip" data-placement="top" title="" data-original-title="全选"></span><br /> <span type="button" class="copyCode code-tool" data-toggle="tooltip" data-placement="top" data-clipboard-text="cd node_modules/airlog node airlog-server.js 3000" title="" data-original-title="复制"></span> </div> </p></div> <pre class="hljs properties"><code><span class="hljs-attr">cd</span> <span class="hljs-string"><a href="http://www.js-code.com/tag/node" title="浏览关于“node”的文章" target="_blank" class="tag_link">node</a>_modules/airlog</span> <span class="hljs-attr">node</span> <span class="hljs-string">airlog-server.js 3000</span></code></pre> <p><span class="img-wrap"><img data-src="/img/remote/1460000010937675" src="https://static.segmentfault.com/v-5cc2cd8e/global/img/squares.svg" alt="" title="" style="cursor: pointer;"></span></p> <h3 id="articleHeader3">Client</h3> <p>根据提示信息添加 script 标签,你可以配置 al-level , 默认为 default ,当设置为 error 时,将只打印错误信息</p> <div class="widget-codetool" style="display:none;"> <div class="widget-codetool--inner"> <span class="selectCode code-tool" data-toggle="tooltip" data-placement="top" title="" data-original-title="全选"></span><br /> <span type="button" class="copyCode code-tool" data-toggle="tooltip" data-placement="top" data-clipboard-text="<script id=&quot;airlog&quot; al-level=&quot;default&quot; src=&quot;//{your_host}:{your_port}/airlog-client.js&quot;></script>" title="" data-original-title="复制"></span> </div> </p></div> <pre class="hljs xml"><code style="word-break: break-word; white-space: initial;"><span class="hljs-tag">&lt;<span class="hljs-name">script</span> <span class="hljs-attr">id</span>=<span class="hljs-string">"airlog"</span> <span class="hljs-attr">al-level</span>=<span class="hljs-string">"default"</span> <span class="hljs-attr">src</span>=<span class="hljs-string">"//{your_host}:{your_port}/airlog-client.js"</span>&gt;</span><span class="undefined"></span><span class="hljs-tag">&lt;/<span class="hljs-name">script</span>&gt;</span></code></pre> <p>打开你配置的地址,如 <a>localhost:3000</a> 查看 LOG 信息。</p> <p></code></p>

本文固定链接: http://www.js-code.com/vue-js/vue-js_25366.html