使用Electron制做一个快速搜索应用(入门向)

什么是Electron

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

因为日常去不一样的站点搜索进行代码搬运时要常常切换不一样的网站再进行搜索,原本想作一个整合搜索的站点方便本身日常搜索用;后来看到vscode突然以为能够使用它的爸爸——Electron来作一个试试,顺便练练手入门一下Electron,并且还能够使用快捷键呼出窗口来搜索,比用网站作更快。github

想作的功能有:npm

  1. 日常隐藏在系统托盘,使用时用快捷键Alt+ s呼出搜索窗口
  2. 能够拖动搜索按钮,调整顺序
  3. 能够自定义搜索站点,增长删除修改
  4. 可设置开机启动

项目地址 能够下载DEMO玩玩,直接解压缩就能够了demo.zipjson

应用GIF

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

1.gif

直接回车至关于点击第一个按钮

2.gif

翻译

3.gif

拖动调整位置

4.gif

设置

5.gif

添加网站

6.gif

删除网站

7.gif

拖动调整位置

8.gif

使用

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

打包

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

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

而后使用 npm run dist 进打包app

npm run dist
复制代码
相关文章
相关标签/搜索