electron-01 基础及NPM相关配置

electron基础

结构

  • Chromium
  • Node.js
  • Native apis

工作流程

  1. 启动APP
  2. 主进程创建window
  3. Win加载界面
  4. 操作

主进程

  • package.json中main属性对应的文件
  • 一个应用对应一个主进程
  • 只有主进程可以进行GUI的API操作

渲染进程

  • windows中展示的界面通过渲染进程表现
  • 一个应用可以有多个渲染进程

开始应用

设置NPM配置

打开.npmrc 文件(Windows 用户目录下),写入如下配置即可;

shell 复制代码
registry=https://registry.npmmirror.com/
electron_mirror=https://npmmirror.com/mirrors/electron/
electron_builder_binaries_mirror=https://npmmirror.com/mirrors/electron-builder-binaries/
sqlite3_binary_host_mirror=https://npmmirror.com/mirrors/sqlite3/
chromedriver_cdnurl=https://npmmirror.com/mirrors/chromedriver/
operadriver_cdnurl=https://npmmirror.com/mirrors/operadriver/
fse_binary_host_mirror=https://npmmirror.com/mirrors/fsevents/

NPM 相关操作

shell 复制代码
# 清除缓存
npm cache verify
# 查看镜像
npm config get registry
# 设置镜像
npm config set registry https://registry.npmmirror.com

快速开始

shell 复制代码
git clone https://github.com/electron/electron-quick-start
cd electron-quick-start
npm install
npm start

使用npm开始

shell 复制代码
npm install electron --save-dev

## npm 下载卡着-- 设置NPM的设置之后使用就不会卡了
npm install -g cnpm --registry=https://registry.npmmirror.com
cnpm install --save-dev electron

打包应用

shell 复制代码
npm install @electron-forge/cli --save-dev 
npx electron-forge import
npm run make
相关推荐
悦涵仙子31 分钟前
CSS中的变量应用——:root,Sass变量,JavaScript中使用Sass变量
javascript·css·sass
兔老大的胡萝卜32 分钟前
ppk谈JavaScript,悟透JavaScript,精通CSS高级Web,JavaScript DOM编程艺术,高性能JavaScript pdf
前端·javascript
cs_dn_Jie4 小时前
钉钉 H5 微应用 手机端调试
前端·javascript·vue.js·vue·钉钉
开心工作室_kaic5 小时前
ssm068海鲜自助餐厅系统+vue(论文+源码)_kaic
前端·javascript·vue.js
有梦想的刺儿5 小时前
webWorker基本用法
前端·javascript·vue.js
清灵xmf6 小时前
TypeScript 类型进阶指南
javascript·typescript·泛型·t·infer
小白学大数据6 小时前
JavaScript重定向对网络爬虫的影响及处理
开发语言·javascript·数据库·爬虫
qq_390161776 小时前
防抖函数--应用场景及示例
前端·javascript
334554326 小时前
element动态表头合并表格
开发语言·javascript·ecmascript
John.liu_Test7 小时前
js下载excel示例demo
前端·javascript·excel