使用Electron制作一个快速搜索应用（入门向）

什么是Electron

Electron是由Github开发，用HTML，CSS和JavaScript来构建跨平台桌面应用程序的一个开源库。 Electron通过将Chromium和Node.js合并到同一个运行时环境中，并将其打包为Mac，Windows和Linux系统下的应用来实现这一目的。

由于平常去不同的站点搜索进行代码搬运时要经常切换不同的网站再进行搜索，本来想做一个整合搜索的站点方便自己平常搜索用；后来看到vscode忽然觉得可以使用它的爸爸——Electron来做一个试试，顺便练练手入门一下Electron，而且还可以使用快捷键呼出窗口来搜索，比用网站做更快。

想做的功能有：

平常隐藏在系统托盘，使用时用快捷键Alt+ s呼出搜索窗口

可以拖动搜索按钮，调整顺序

可以自定义搜索站点，增加删除修改

可设置开机启动

<!-- more -->
项目地址
可以下载DEMO玩玩，直接解压缩就可以了demo.zip

应用GIF

Alt + s 呼出窗口,点击选择搜索目标网站

直接回车相当于点击第一个按钮

翻译

拖动调整位置

设置

添加网站

删除网站

拖动调整位置

使用

# Clone this repository git clonehttps://github.com/wadejs/W-SEARCH.git # Install dependencies npm install # Run the app npm start

打包

这里使用electron-builder进行打包
在package.json中加入以下代码

"scripts": {"dist": "electron-builder --win --x64"}, "build": {"appId": "searchApp","productName": "W-SEARCH","mac": {"target": ["dmg","zip"]},"win": {"target": ["nsis","zip"],}}

然后使用 npm run dist 进打包

npm run dist

总结

以上是生活随笔为你收集整理的使用Electron制作一个快速搜索应用（入门向）的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。