Web2Desk是一套基于Node.js编写的程序,核心功能是将任意互联网网站(仅需URL)转换为基于Electron框架的桌面应用程序!支持一键生成macOS、windows和Linux平台的应用程序。同时,得益于强大的自定义能力,无需更改现有PC网站或手机网页内容,即可快速适配,可以个性化配置网站地址、菜单、图标、隐藏页面某些元素、弹窗、加载页动画等。简单来说就是:只要PC网页里能实现的功能,打包生成应用程序后任然能用!

源码下载地址:

https://www.jindianweb.com/codes/item-64.html


一、项目文件结构
    node_modules -所有依赖文件存放目录
    public  - 所有图片、样式、加载页、静态页面存放目录
    build – 应用程序图标存放目录,有icns、ico、png格式的图标
    dist – 生成的应用程序存放目录
    config.js - 项目配置文件
    package.json - NodeJS应用配置文件
    menu-config.js – 应用程序顶部菜单配置文件
    right-menu-config.js  – 应用程序窗口内右键菜单配置文件

二、安装使用
重要提示:
1、以下步骤需要修改文件的,请不要直接使用记事本打开编辑,推荐使用notepad++
2、修改的地方可参考原文件,有的地方不能使用中文字符,以免报错,如有疑问可以联系客服微信zjx618918咨询


1、修改package.json文件----应用程序相关信息

package

2、修改right-menu-config.js文件----右键菜单配置

right-menu-config

3、修改menu-config.js文件----主菜单配置

menu-config

4、修改config.js文件----应用程序主要配置信息
config


三、修改应用程序图标
在build文件夹中包含3个图标文件,名称必须是icon,格式依次为icns、ico、png,图标大小必须是256x256px

icon


四、修改默认页面内容
about.html  应用简介页面
offline.html  网络离线时页面
loading.html  程序加载页面,建议保留

pages

如果你需要在主菜单显示其他页面,只需在此目录中添加新页面,菜单配置文件 menu-config.js中新增菜单项即可

对于主菜单和右键菜单,支持的操作有:
Undo, redo, cut, copy, paste, pasteAndMatchStyle, delete, selectAll, reload, forceReload, toggleDevTools, resetZoom, zoomIn, zoomOut, togglefullscreen, window, minimize, close, help, about, services, hide, hideOthers, unhide, quit, startSpeaking, stopSpeaking, close, minimize, zoom, front, appMenu, fileMenu, editMenu, viewMenu, recentDocuments, toggleTabBar, selectNextTab


五、本地运行应用程序
首先确保您的电脑已经安装了Node.js(建议最新版,小编使用的是15.14.0版本),如果还未安装,请先下载安装。下载地址:https://nodejs.org/en/
1、打开命令行工具,cd切换到项目根目录下,运行安装依赖命令:
  npm install
确保所需依赖都安装正确,就是命令行没有报错!

2、接着运行即可打开应用程序
  npm start

六、打包创建应用程序
注意,macOS系统的用户可以打包创建macOS、 Windows、Linux的应用程序;Windows系统用户只可以打包生成Windows和Linux的应用程序
1、安装electron-builder
继续在命令行中输入下面命令安装  npm i electron-builder -g

2、生成所有平台的应用程序:electron-builder -mwl

3、生成windows平台的exe程序:electron-builder --win

4、生成mac平台的应用程序:electron-builder --mac

5、生成Linux平台的应用程序:electron-builder --linux            
            
生成的不同平台的应用程序将放在dist目录中。

下面展示金点网生成的应用:应用程序内所有功能完全正常!

生成的应用信息

首页

首页

列表页:

文章列表页