electron
官方文档: https://www.electronjs.org/docs/all

开发技术选择
- 原生js
> git clone https://github.com/electron/electron-quick-start
> cd electron-quick-start
> npm i
> npm start
或
> npm init
> npm i electron -D
> electron .
- react
> git clone --depth 1 --single-branch --branch master https://github.com/electron-react-boilerplate/electron-react-boilerplate.git electron-react-start
> cd electron-react-start
> npm i
> npm run dev
- vue
先安装gyp (安装跨平台编译器的工具),
然后安装Windows的编译工具 (需要以管理员身份运行cmd)
npm i node-gyp -g
npm i -global -production windows-build-tools
> npm i electron -g
> vue init simulatedgreg/electron-vue electron-vue-start
> cd electron-vue-start
> npm i
> npm run dev
安装过程中的问题
执行到node install.js等一段时间就会报奇怪的错误。
-
检查下自己的nodejs,npm版本是否合适,registry是否合适。
-
我们手动执行以下npm install electron,发现再次执行到node install.js的时候关闭cmd窗口
-
进入“项目路径”/node_modules/electron,新建path.txt文件,编写内容“dist/electron.exe”。 (如 dist/electron-v2.0.4-win32-x64.zip/electron.exe)
-
新建dist文件夹,去https://npm.taobao.org/mirrors/electron 下载对应版本的压缩包,解压到dist下。比如我需要1.7.9的win64版本,则下载了的electron-v1.7.9-win32-x64.zip的压缩包。
这四件事情做完以后,再次打开cmd运行npm run dev,demo就能跑起来了~
打包.exe
利用electron-packager打包, 打包前一定要npm run build, 不然打包出来的是初始的electron项目
> npm install electron-packager -D
> npm install electron-packager -g
> electron-packager . JulnMusic --win --out …/JulnMusic --arch=x64 --electron-version=4.0.1 --app-versionn=1.0.0 --overwrite --icon=./julnMusic.ico
- . 是项目源所在路径
- JulnMusic 是打包的项目名
- -win是选择平台
- –out ./JulnMusic 是项目打包路径
- –arch=x64 选择64位或32位
- –electron-version=4.0.1 是electron的版本
- –app-versionn=1.0.0 项目的版本号
- –overwrite 应该是如果–out的文件存在就覆盖
- –icon=./julnMusic.ico 是项目图标的路径

本文详细介绍了如何在Windows环境下使用Electron进行开发,包括原生JS、React和Vue的集成方式,以及安装过程中遇到的问题和解决办法。重点讲解了手动解决npm安装错误的步骤,并提供了使用electron-packager打包成.exe应用的具体命令行参数。
354

被折叠的 条评论
为什么被折叠?



