Tampermonkey开发体验Vscode抹平计划进度

李恒道 · 发表于 2024-4-15 00:11:48

测试视频链接https://www.zhihu.com/zvideo/1762995118146314240
目前已经实现了基本的文件监听，自动上传，刷新

王一之 · 发表于 2024-4-15 00:24:49

uuorz · 发表于 2024-4-16 09:54:23

ggnb，我挺喜欢直接用tampermonkey，因为它有require files，脚本猫虽然也能引入本地文件。但是有缓存，当引入的脚本更改时，需要修改版本号，挺麻烦的，你的这个抹平计划虽然很牛逼，不过我看不懂，哈哈哈。前端小白，对前端的技术栈不太了解，请教一下，有哪些依赖。我也想尝试一下，还有就是个人愚见，油猴支持require 本地文件。所以，只需当修改时，要上传头文件的更改即可

李恒道 · 发表于 2024-4-16 10:31:23

uuorz 发表于 2024-4-16 09:54
ggnb，我挺喜欢直接用tampermonkey，因为它有require files，脚本猫虽然也能引入本地文件。但是有缓存，当 ...

脚本猫已经实现了vscode插件对接，油猴require本地文件虽然相对比较方便，但是每次协议头修改都需要自己搞，而且还需要刷新，抹平之后相当于只需要声明一个项目，然后npx运行我的包文件唤起浏览器，写出来的代码就可以自动刷新，相对原来require更爽一点，不需要来回切换浏览器了。

原理就是利用pupeteer加载插件，对插件进行了非侵入式hook，并且起了个服务器跟浏览器的插件用socket通信

后续会发布到npm作为包，直接调一下命令就ok了

李恒道 · 发表于 2024-4-16 10:33:09

uuorz 发表于 2024-4-16 09:54
ggnb，我挺喜欢直接用tampermonkey，因为它有require files，脚本猫虽然也能引入本地文件。但是有缓存，当 ...

比如以前你加个API，需要切到浏览器一下，加个require需要浏览器引入一下

现在全部都可以挪到vscode里，一个命令唤起测试浏览器

剩下全部在vscode搞就可以了，每次保存文件都会自动刷新加载过脚本的页面显示最新的结果

uuorz · 发表于 2024-4-16 17:57:20

李恒道发表于 2024-4-16 10:33
比如以前你加个API，需要切到浏览器一下，加个require需要浏览器引入一下

现在全部都可以挪到vscode里， ...

嗯嗯。期待npm包，如果能做成那种类似脚本猫和vscode的交互形式就更好了。

shabby · 发表于 2024-4-16 21:36:18

大佬好，请问这个能做到下面的这种体验吗？

![hmr](

)

李恒道 · 发表于 2024-4-17 01:35:28

shabby 发表于 2024-4-16 21:36
大佬好，请问这个能做到下面的这种体验吗？

![hmr]()

哥哥才是大佬，hhh

暂时不打算做HMR

主要就是实现了原油猴的自动设置新脚本和刷新

HMR通信就属于脚本应该干的了

Tampermonkey开发体验Vscode抹平计划进度

发表回复

荣誉开发者

管理员

油中2周年

生态建设者

喜迎中秋

油中3周年

挑战者 lv2