其中使用<webview>标签，src引入需要内嵌的web页面路径，可以是本地文件，也可以是远程请求，例如src=“https://www.douyin.com/”，引入抖音官网主页
然后通过<script>引入渲染脚本
2.主窗口主进程入口文件main.js
该文件中，创建主窗口，并在创建过程中 通过设置webPreferences的preload属性来引入预先加载的js脚本，通过设置webviewTag属性为true，才能在使用webview标签
该文件中，通过ipcMain.handle(eventName,function(){})来设置具体的事件处理过程，并返回一个结果，这个结果会在渲染进程中拿到
3.预加载脚本preload.js文件
该文件中，预先设置了一些自定义事件函数，这些函数被桥接在window上，当在renderer.js中调用window.pageClick.mainPageClick()时，会触发对主进程的通信，即ipcRenderer.invoke(eventName)，该eventName与主进程中ipcMain.handle(eventName,())中的一致
4.主窗口渲染脚本renderer.js
该文件中，获取dom节点，设置监听事件，然后通过调用window.pageClick.mainPageClick()这个预先定义在preload.js中的方法，来触发向主进程的通信，主进程对相应自定义事件进行处理，并返回处理结果，拿到结果后，可以对页面进行一些操作，例如文本展示或切换webview引入的页面内容
整个过程：页面定义dom结构，然后操作页面点击，触发在renderer.js里面的点击事件，从而调用window相应方法，触发在preload.js中预先设置的方法调用，从而渲染进程向主进程通信触发主进程事件，在main.js中收到来自渲染进程通信触发，进行具体事件处理，可能会有返回值，返回至renderer.js中，然后渲染进程可根据返回值做进一步的页面处理操作
5.给webview也设置预加载脚本
给webview标签设置preload属性，并引入对应脚本路径，可以是相对路径
6.webview中引入的web页面test.html
需要引入对应的webRenderer.js文件
7.webview中预先加载的脚本文件webviewPreload.js
同样可以设置一些自定义事件，桥接在window上
8.webview中引入的渲染脚本webRenderer.js
该文件中，获取dom节点，监听事件，触发事件处理函数
9.界面运行后效果
通过点击test1模块，触发事件，会在红色区域显示文字
通过点击主窗口左侧栏首页，可切换webview显示的web页面内容
几个注意点：
1.所有的具体事件处理，即ipcMain.handle()都定义在主窗口主进程main.js文件中
2.在主窗口的渲染进程renderer.js中，无法触发在webview引入的页面对应的预加载文件webviewPreload.js中定义的事件
3.在webview引入的页面对应的渲染进程webRenderer.js中，也无法触发在主窗口的预加载文件preload.js中定义的事件
使用webview标签是为了在主页面中嵌入其他web页面内容，类似小窗口使用webview1.主窗口对应的页面index.html其中使用<webview>标签，src引入需要内嵌的web页面路径，可以是本地文件，也可以是远程请求，例如src=“https://www.douyin.com/”，引入抖音官网主页然后通过<script>引入渲染脚本2.主窗口主进程入口文件main.js该文件中，创建主窗口，并在创建过程中 通过设置webPref.
电子应用程序
设置
一个简单易用，高效且多进程的安全
设置
框架
，该
框架
假定了一个应用程序配置文件。
旨在允许通过和通信在主进程和渲染器进程之间共享
设置
。 主进程充当所有渲染器进程的主进程，加载初始配置文件，管理同步以及在应用程序退出时保存配置。
与生成的配置文件兼容。
简单的语法允许转义的点表示法例如，“ my \ .property” => {“ my \ .property”：...}
自动合并默认值
基于IPC的无配置
设置
同步
使用
简单-随需随用，即可开始
使用
！
还没有键=>值监控（尚未）
仅退出时保存（待进一步扩展）
单个
设置
文件（可以更改，但可能超出模块范围）
$ npm install
electron
-app-settings --save
不论是否在主过程中加载了
electron
-app-settings都可以在任何需要的地方简单地进行，因
webview
标签
用于集成 'guest（访客）' 内容（比如外部的网页）在你的
Electron
应用内。它们类似于iframe，但是不同的是每个
webview
运行在独立的进程中。 作为页面它拥有不一样的权限并且所有的嵌入的内容和你应用之间的交互都将是异步的。 这将保证你的应用对于嵌入的内容的安全性。
webview
是 行内元素
<
webview
src="https:...
注意：本文基于
electron
-vue项目（在vue2项目上运行vue add
electron
-builder命令搭建而成）
并在
electron
8.5.5及9.0.0测试过
在
webview
中开发者可以
使用
preload
预加载并执行js文件 官方文档
网上以及官方的很多例子都是传入一个相对路径的String，并没有以file://开头。然而我这里只能传入String字符串并且是file协议的，
electron
会检测是不是以file://开头，不符合就会报错（不知道是不是我配置有问题还是啥…反正只要不以
const { contextBridge } = require('
electron
')
contextBridge.exposeInMainWorld('apiKey', {
fn: () => {}
// 在
webview
页面
使用
在主线程 main.js 中 需要打开权限 nodeIntegrationInSubFrames: true
在页面
标签
中也需要打开权限 nodeintegrationinsubframes
main.js
async function createWindow() {
// Create the browser window.
const win = new Browser
第一种：通过window的webcontent对象，
使用
此种方式需要单独开出一个打印的窗口，可以将该窗口隐藏，但是通信调用相对复杂。
第二种：
使用
页面的
webview
元素调用打印，可以将
webview
隐藏在调用的页面中，通信方式比较简单。
两个对象调用打印方法的
使用
方式都一样。
本文是通过第二种方法实现静默打印。
三、实现过程：
1、要实现打印功能，首先要知道我们的设备上有哪些打印机。方法是：在渲染线程通过
electron
的ipcRenderer对象发送事件到主线
即使在移动端和云端大行其道而，桌面端日渐落末的现在，我的心中仍然为桌面应用留有一个特殊的位置。和Web应用比起来桌面应用的优点还是很多的：只要把它们放在开始菜单栏或者dock上，你就能随时打开它们；还可以通过alt-tab或者cmd-tab切换应用；和操作系统之间的交互更良好（快捷键，通知栏等）。
使用
JavaScript开发桌面应用意味着在打包（packageapplication）的时候你会需要根据操作系统的不同发出不同的命令。这一行为是将原生桌面应用兼容不同平台的概念抽象出来，方便维护应用。现在，我们可以借助
Electron
或者NW.js开发一个桌面应用。其实这两者提供的或多或少差不多的特
A little strawberry:
