12月3日消息，每天都会更新一些优质内容，其中包括礼想艺品,礼想,诚智通,易讯,嗒米购,莱迪购,商盟讯,深聊,探聊,惠趣购,千语优选,城言,友点赞,淘一购,一点购,亲聊,千语,新聚淘,聊购汇,博立购,苹果微信多开,安卓微信多开,星讯,乐享购,大麦购,纯净优选,淘个购,四季优选,古集优选,三秋,思语,搜货郎,聚通汇购等热门社交平台，辅助功能有单透软件,秒抢红包,埋雷软件,扫尾,避雷软件等。喜欢的请关注收藏吧！

在一切开始之前，我想先向uTools致敬！？没有它，就没有拉比克。

大家好，我是火资源，“Labik”项目的作者。我做的拉比克是一个基于电子的开源桌面工具箱。简单来说就是集合了很多工具，然后集成了快速启动、丰富插件扩展等功能。

没错！它的用法和外观与uTools几乎一样。那我为什么不使用免费的工具，而自己去弄一个呢？

之所以这样，是因为出于安全考虑，一些只适用于公司的插件无法发布到插件市场，所以无法访问uTools。不过我真的很佩服uTools便捷一次性的极简操作体验。寻找解决方案无果，同时发现其他朋友也有同样的要求，于是就做了，然后就开了。

拉比克是一个开源工具箱，调用速度超快，用后就跑。因为是开源，所以更自由！

项目地址:https://github.com/clouDr-f2e/rubick

希望能帮你解决同样的烦恼，但目前只支持Windows和macOS，Linux版本正在开发中。想用开源的力量让拉比克变强，成为金牌助手！帮助大家轻松“超神”！

在拉比克的过程中，我仍然遇到了许多问题和挑战。下面我来分享一下我的心路历程。

一、Origin 1.1了解electronic是GitHub开源的一个框架。它通过Node.js和Chromium的渲染引擎完成跨平台桌面GUI应用的开发。我一开始并没有接触过Electron，但是第一次接触是因为看到了PicGo的一个核心功能非常吸引我，那就是在macOS下，你可以直接拖拽图片到任务托盘上传图片:

当时我们团队还需要搭建一个内部的CDN图片资源管理图床，用来压缩项目图片资源，直接上传到CDN。在此之前，我们做了网页版。在这里，我深深地感受到了电子的力量，它可以大大提高工作效率。参考PicGo，尝试做了第一个电子项目，完成了图片压缩上传到内部CDN的桌面应用。

1.2演进之后，公司在与后端开发接口调试测试环境时，往往会涉及到一些状态变化依赖于交互风格的问题。比如测试需要测试待付款、付款进行中、付款完成等各个节点的交互风格是否。达到预期。在这种情况下，测试通常会创建数据或让后端更改数据库接口。有些朋友可能会用Charles修改返回的数据进行测试，但是Charles的抓取包和配置的体验感觉有点麻烦，对新人也不是很友好，所以我们自己做了一个非常好用的抓取包& Mock tool:

这也是拉比克最早的原型。随后，我们发现当页面在线发布时，在微信环境下没有办法调试在线页面，于是我们开发了基于winner的远程调试功能。

但是随着拉比克在内部的推广和使用，需要的功能越来越多。我们需要诸如需求管理、性能评估、隐藏点检测等工具。一方面，这些工具的增加导致了拉比克量的爆炸；另一方面导致用户需要不断更新自己的软件，导致用户体验非常差。

其次，我们在向测试和UI学生推广的时候，发现他们其实并没有注意到之前的页面调试、性能评测等功能，可能他们只用了其中的一个，所以整个项目在他们看来就显得臃肿了。

1.3灵感直到有一天，我在金块上看到了这样一个沸点:

下面的评论提到了uTools。这是我第一次与uTools不期而遇。体验完uTools的功能，我长长地吸了一口气:这不就是我想要的吗！然后去GitHub找uTools的源代码，发现不是开源的。

所以我想把上面提到的工具发布到uTools market，通过插件在uTools中使用。但是我发现发布插件只能发布到公网，但是这涉及到数据安全的问题。

无奈，真的要自己做这样的工具吗？真的是点头大。不过想想也挺有意思的。此时，我产生了开发一个可以与uTools相媲美的开源工具箱的想法。

第二，R&D开业的第一步，按照我以前的套路，就是取个好名字，先占个坑。我是一个Dota玩家，之前写过一本名为《从0开始的视觉构建》的小册子，里面用到了Dota coco(队长)中一个英雄的名字。这次我取名为鲁比克，也就是拉比克。拉比克(拉比克)也是Dota中的英雄之一。它的核心技能是插上其他英雄的技能，然后跑路。它非常符合这个工具的设计理念，所以被命名为拉比克。

我的核心目标是让拉比克支持插件并解决前面提到的问题:

每个人的工具箱都有巨大的软件量增加，每增加一个工具都需要更新。其次，通过调查，我们知道团队中已经有同学在使用uTools了。如果他们想零成本的将插件从uTools迁移到拉比克，就必须实现uTools的一些API能力，插件的定义和编写也需要符合uTools的规范。

2.1开发者模式插件开发需要和拉比克一起调试，所以拉比克需要支持开发者模式，帮助开发者更好的开发插件。首先构建一个plugin.json来描述插件的基本信息:

{"pluginName ":"测试插件"，"作者":" muwoo "，"描述":"我的第一个rubick插件"，" main ":"index.html "，" version ":"0.0.2 "，" logo ":"logo.png "，"

在点击埋雷软件新增的rubick插件功能时，需要跳转到首页，加载插件的基础类内容。唯一需要注意的是，首页加载内容的高度应该是拉比克最大窗口的高度。所以你需要调整窗口的大小:

IPC renderer . send(' changeWindowSize-rubick '，{ height: getWindowHeight()，})；这里就不详细介绍renderer中的Vue代码了，因为大部分都是css。直接看显示界面就可以了:

至此，开发者模式完成。接下来，我们来谈谈插件在拉比克是如何运行的。

2.3插件操作原理插件需要容器电子提供一个webview容器来加载外部网页。所以可以利用webview的能力实现动态网页渲染，这里所谓的网页就是一个插件。但是网页不能使用node的能力，插件的目的是开放和限制，所以需要向插件开放一些内置的API能力。幸运的是，webview提供了预加载功能，可以预设一个脚本在页面加载时执行。

也就是说你可以写一个preload.js让你的插件加载。不过这里需要注意的是，需要保持插件的个性，为插件注入全局API，所以可以直接加载拉比克内置的preload.js，然后在preload.js中加载个性化的preload.js:

//webview plugin . vue & lt；webview id = " webview ":src = " path ":preload = " preload " & gt；& lt/webview & gt；& lt脚本& gt导出默认{ name: "index.vue "，data(){ return { path:` file://$ { this。$route.query.sourceFile} `，//Load preload . js preload:` file://$ { path . join(_ _ static，'。/preload.js') } `，webview: null，query: this。$ route.query，config:{ } } }

if(location . href . index of(' target file ')& gt；-1){ file path = decodeURIComponent(getQueryVariable(' target file ')；} else { file path = location . pathname . replace(' file://'，' ')；} window.utools = {// utools所有api实现}//加载插件preload . js require(path . join(file path，’../preload . js '))；到目前为止，已经实现了最基本的插件加载，效果如下:

2.4支持更多体验能力。然后，为了更贴近uTools的体验，我开始让拉比克支持更多原生体验增强的功能:超级面板、模板、系统命令、全局快捷键等。

一个偶然的机会，发现HelloGitHub的一个平台推荐开源项目，了解到小何也喜欢打Dota。我想他应该能感受到拉比克的魅力，所以我抱着试一试的心态提交了它。我很幸运地被选为第64期月刊，然后我被邀请写这个关于拉比克的故事。

最后感谢HelloGitHub让拉比克被更多人发现和喜欢，特别感谢小何对文章的打磨和修改，为这篇文章增色不少。