Tampermonkey 使用本地编辑器开发的流程
关于Tampermonkey 使用本地编辑器开发的一些准备工作
在Tampermonkey 提供的编辑器里面进行编码实在是太劳累了,于是找了找使用本地编辑器编写代码的方法,在这里做一下总结。
Vue使用CDN减小打包体积
Vue 使用 CDN 减少打包体积
详细步骤
具体的步骤无需赘述了,index.html
之中引入 CDN 的 script
<!-- axios -->
<script src="https://cdn.bootcss.com/axios/0.19.0-beta.1/axios.min.js"></script>
<!-- Vue -->
<script src="https://cdn.bootcss.com/vue/2.5.17/vue.min.js"></script>
<!-- VueRouter -->
<script src="https://cdn.bootcss.com/vue-router/3.0.2/vue-router.min.js"></script>
<!-- ElementUI -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/element-ui/2.4.11/index.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/element-ui/2.4.11/theme-chalk/index.css" rel="stylesheet"/>
第二步在webpack
里面配置externals
:
entry: {
app: './src/main.js'
},
externals:{
'vue': 'Vue',
'vue-router': 'VueRouter',
"axios":"axios",
"ElementUI":"ELEMENT",
},
最后从组件中删除 import xxx from vue
之类的即可。
事实上不删也无所谓,webpack打包时自会略去这一部分(前提是与external中配置的名称一致)。
KOA与stream的一个坑
绝对不要使用 ctx.body = request.get(stream_link)
在我的一个本地Server中,制作了一个解析视频网站视频流的API
大概的形式是这样的,
由 nodejs 向 视频网站请求流,然后使用ctx.body = request.get(stream_link)
的方式向本地播放器输出流。
但是这其中有一个非常大的问题,就是在关闭播放器,KOA也获取到 ECONNRESET
错误的情况下,无法 destory Request的流。
这就导致即使关闭了播放器,nodejs依然在下载对应的那个视频,如果多切换几个视频,后台就会有多个下载任务占用带宽。
找了半天没有找到处理办法,KOA的相关讨论也只是说尽量不要给ctx.body
设置为HTTP流。
最后直接Hack了一下,在app上直接监听Error
事件,发生ECONNRESET
的时候直接process.exit(0)
,反正后台有 forever
的Daemon。
至少目前还没有找到可靠的处理方法。
如果可以处理的话,思路大概这样,将HTTP stream
的引用暂存起来,读取ECONNRESET
,并且与对应的ctx对应,找到 stream ,想办法结束流。
这个就留待以后实现吧,仅在此做一个记录
严格模式下取得函数调用栈
这个很简单,以console.log
举例吧
由于严格模式不能使用caller
、callee
和arguments
,因此使用Error
来拿到调用栈。
代码如下:
let log = console.log;
console.log = function myLog(...args){
try{
log(...args);
throw(new Error("[!] - 检查到未被移除的Log调用:"));
}catch(e){
log(e.stack);
}
}
大概就是两步,第一步,把这个函数拿出来,第二步,用另一个函数代理,然后抛出错误,打印e.stack
即可
在尝试寻找并移除一个log提示时,为了打印该log的调用栈,而整理了这个方法。