Preface
上一篇文：年轻人的第一个音乐播放器
因为网页打开后老被我误关，就想着用打包一个桌面应用。
然后因为我啥都不会，只能现学一个最简单的了。
再次踩在前人的肩膀上选择了 Electron-forge 这个工具。
一个小时才搞定了最简单的打包，发布在了Github。
不过我的时间大都花在了看 Electron 的文档和下载环境上，Electron 还有一些 npm 包因为网络问题半天没下好；文档说实话没咋看明白，不知道是中文翻译的问题还是我的问题，我照猫画虎才把菜单栏取消掉。
Start
- 首先得有Node.js，这个前端应该人人都有。
- 然后换个源，要不然经常下载不成功。
npm config set registry https://registry.npm.taobao.org 复制代码
- 安装：
npm install electron -g npm install create-electron-app -g 复制代码
- 如果实在安装不成功 Electron 的话（比如我），试试这种方式：
# 先把不成功的卸了 npm uninstall electron ELECTRON_MIRROR=http://npm.taobao.org/mirrors/electron/ npm install -g electron 复制代码
- 安装成功后初始化项目（这一步可能非常漫长）：
create-electron-app app-name 复制代码
- 启动：
cd app-name npm run start 复制代码
启动成功后会出现了一个应用：
Make & Build
- 在 src 目录下，把我们的文件放到
index.html中。 - 然后修改
index.js：
const { app, BrowserWindow, Menu } = require("electron"); const createWindow = () => { const mainWindow = new BrowserWindow({ // 应用图标要放在当前目录下 icon: __dirname + '/icon.png', width: 900, height: 700, }); mainWindow.loadFile( path.join(__dirname, "index.html") ); // mainWindow.webContents.openDevTools(); // 去除菜单栏 Menu.setApplicationMenu(null); }; 复制代码
- 测试一下
npm run start - 直接默认配置打包
npm run make
完成会有一个 out 文件夹，会有一个安装包和一个可以直接运行的 exe 文件：
点开可执行程序，完成：
Summary
当然还有更多打包的细节可以修改，我就不勉强自己了，有需要的可以在油管搜一搜。
还有一些感悟：很多东西就是看起来挺复杂，真正做起来却很简单，冲冲冲就完事了！不要老是想做而不去做，很多东西都是大佬们做好而且写好教程就差喂你嘴里了😂
