今日掘友分油猴插件的代码越来越多,超过了上千行,导致调试变得十分麻烦。
调试方式的演进之路:
- 直接在油猴脚本的编辑器中编辑,这种方式只适合代码行数较少的情况。
- 随着代码量越来越多需要模块化开发,因此开始在外部编辑器使用模块化开发,并使用rollup这类打包工具,然后将打包后的文件内容拷贝到油猴编辑器中。这一步也是十分繁琐。
- 打包时,同时将代码发布到npm,然后使用第三方cdn(cdn.jsdelivr.net)加载最新版本。油猴中无需写任何代码,只需使用
@requre https://cdn.jsdelivr.net/npm/jinrijueyoufen。但是存在cdn缓存问题,本地调试还是很麻烦。 - 本地调试时,油猴中引入本地文件;稳定后再发布新版本。
刷新cdn缓存
当发布新的版本时,需要刷新cdn缓存。
访问https://purge.jsdelivr.net/npm/jinrijueyoufen进行缓存更新。需要注意的是,缓存更新是有节流设置的,不能频繁更新。
油猴引入本地脚本设置
- 使用
@require file:///User/用户名/file/to/path - 必须设置油猴插件可以访问本地文件,否则执行上一句时会无效,并提示无法访问本地文件。
在浏览器扩展程序中找到tampermonkey(篡改猴),点击详情,然后打开允许访问文件网址。