乐趣区

关于electron:Electron开发环境搭建

最近做一个 Electron 直播的我的项目,记录一下我的项目中的播种与心得与大家独特成长。

electrion 的弱小之处大家都有所耳闻,这里有不再赘述了。最典型的胜利案例非 VS Code 家喻户晓咱们搭建环境是老本很高的,在尝试了各种计划当前播种了很多。首先咱们从官网的教程开始一步步实现一个 electron 我的项目。

1. 装置electron

间接应用 npm i electron 的话有速度慢,卡死等多种问题。咱们装置 electron 须要一些技巧!

计划 1(官网计划)

ELECTRON_MIRROR="https://npm.taobao.org/mirrors/electron/"
ELECTRON_CUSTOM_DIR="{{version}}"
npm i electron 

计划 2(举荐计划)

npm i cnpm -g
cnpm i electron


运行 electron

electron


看到以上画面即示意胜利!!! 应用计划 2 能够 100% 保障胜利,已验证!

2. 应用 @electron-forge/cli 能够疾速搭建 electron 利用。

npm i -g @electron-forge/cli

2.1 转化已有我的项目

如果想要把曾经存在的我的项目转化为electron 我的项目,只需在该我的项目内运行

npx electron-forge import

npx electron-forge 会批改你的 package.json 增加必要的库和 script 命令,主线程的 main.js 须要本人增加,参考官网即可。

2.2 创立新的 electron 我的项目

mkedir test && cd test

npx electron-forge init

通过漫长的装置,我的项目终于创立好了。~~~~

如果安装时间过长,一般来说是在本我的项目中装置 eletron 卡住了,此时能够强行推出,运行npm run start


如果是这个谬误,执行

cnpm i electron -D
npm run start

胜利后 electron 会主动启动我的项目,看到这个界面即示意 electron 新我的项目初始化胜利。

a. src/main.js 是 main 线程的入口文件。

b. src/main.js 中的 index.html 是 renderer 线程的入口文件。


我的项目的目录构造如下

退出移动版