Electron把网页打包成桌面应用并进行源码加密

本文介绍了如何使用Electron将基于HTML、CSS和JS的网页打包成跨平台桌面应用,并详细阐述了打包过程及如何利用Electron的asar工具对源码进行加密,确保应用的安全性。
摘要由CSDN通过智能技术生成

前言

  最近想把自己用html+css+js做的网页界面打包成桌面应用,网上一搜,发现Electron是一个不错的选择,试了试,发现效果真的不错。这里记录一下打包过程以作记录,便于自己以后查看学习。

 

一、简介

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

 

二、打包过程

1.首先保证自己计算机全局安装了nodejs,并且利用nodejs自带的npm全局安装了electron和打包神器electron-packager。两个命令:(npm install electron -g),(npm install electron-packager -g)。注意:npm速度较慢,可以尝试用cnpm,下载安装速度快。

2.在自己的前端网页项目文件夹下,新建 package.json、main.js、index.html 三个文件(注:其中的 index.html 是你的网页首页,就是自己已经写好的网页界面)。

3.在 package.json 中添加如下内容:(name属性值可以自定义,Version属性值也可以自定义,main属性值是根据新建的main.js文件名来的)

{
  "name"    : "app-name",
  "version" : "0.1.0",
  "main"    : "main.js"
}

4.在main.js中插入如下代码:

const {app, BrowserWindow} = require('electron')
const path = require('path')
const url = require('url')
 
//
  • 3
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值