这是在给沙盒游戏LOMS提 PR 时作的一个小工具,用于给那些没有 console 的 B/C 端(nw.js 和 electron)应用提供一个 onscreen 的 console。(唔,游戏缺人手,你们能够关注一下,连接在这https://www.v2ex.com/t/393852)javascript
先放个 demo 图吧,你也能够去这里体验。html
onscreen-console 改写了原生的 console 对象的 log、warn 和 error 方法,启用了 onscreen-console 之后,直接使用 console.log 、console.warn 和 console.error 就能够了。java
npm i -S onscreen-console
import oConsole from 'onscreen-console'; // 启用 onscreen-console oConsole.enable(); // 显示 console 面板 // 默认启用时显示,也有按键显示,可不调用该方法 oConsole.show(); // 按你平时那样用就好 console.log('This is a log'); console.warn('This is a warn'); console.error('This is a error'); // 或者抛出错误 throw new Error('Error thrown'); // 隐藏 console 面板 oConsole.hide(); // 禁用 onscreen-console oConsole.disable();
也能够直接在 html 中引入,min 文件在Release下载,放在onscreen-console/dist/min/onscreen-console.min.js
里,而且给 window 绑了 oConsole 对象,直接用就能够了。git
<script type="text/javascript" src="onscreen-console.min.js"></script> <script type="text/javascript"> // 启用 onscreen-console oConsole.enable(); // 显示 console 面板 // 默认启用时显示,也有按键显示,可不调用该方法 oConsole.show(); // 按你平时那样用就好 console.log('This is a log'); console.warn('This is a warn'); console.error('This is a error'); // 或者抛出错误 throw new Error('Error thrown'); // 隐藏 console 面板 oConsole.hide(); // 禁用 onscreen-console oConsole.disable(); </script>
命令行的话实际上是用 eval 作的,若是要添加全局变量,须要本身绑在 window 对象上,才能访问到。像这样const test = 1; window.test = test;
github
项目地址https://github.com/Siubaak/onscreen-console,其实我只是来求 star 的(逃npm