本文整理自网络,侵删。
Electron 应用打包
为舒缓 Windows 下路径名过长的问题 ,也略对 require 加速以及简单隐匿你的源代码,你可以通过极小的源代码改动将你的应用打包成 asar 文件。
生成 asar 包
asar 是一种将多个文件合并成一个文件的类 tar 风格的归档格式。Electron 可以无需解压整个文件,就能够从其中读取任意文件内容。
参照如下步骤将你的应用打包成 asar文件:
1. 安装 asar
$ npm install -g asar
2. 用 asar pack 打包
$ asar pack your-app app.asar
使用 asar 档案文件
在 Electron 中有两类 APIs:Node.js 提供的 Node API 和 Chromium 提供的 Web API。这两种 API 都支持从 asar 包中读取文件。
Node API
由于 Electron 中打了特别补丁, Node API 中如 fs.readFile 或者 require 之类的方法可以将 asar 视之为虚拟文件夹,读取 asar 里面的文件就和从真实的文件系统中读取一样。
例如,假设我们在 /path/to 文件夹下有个 example.asar 包:
$ asar list /path/to/example.asar
/app.js
/file.txt
/dir/module.js
/static/index.html
/static/main.css
/static/jquery.min.js
从 asar 包读取一个文件:
const fs = require('fs');
fs.readFileSync('/path/to/example.asar/file.txt');
列出 asar 包中根目录下的所有文件:
const fs = require('fs');
fs.readdirSync('/path/to/example.asar');
使用 asar 包中的一个模块:
require('/path/to/example.asar/dir/module.js');
你也可以使用 BrowserWindow 来显示一个 asar 包里的 web 页面:
const BrowserWindow = require('electron').BrowserWindow;
var win = new BrowserWindow({width: 800, height: 600});
win.loadURL('file:///path/to/example.asar/static/index.html');
Web API
在 Web 页面里,用 file: 协议可以获取 asar 包中文件。和 Node API 一样,视 asar 包如虚拟文件夹。
相关阅读 >>
更多相关阅读请进入《Electron》频道 >>

Vue.js 设计与实现 基于Vue.js 3 深入解析Vue.js 设计细节
本书对 Vue.js 3 技术细节的分析非常可靠,对于需要深入理解 Vue.js 3 的用户会有很大的帮助。——尤雨溪,Vue.js作者