electron中使用webworker

2024-09-02

electron项目中使用js web worker时，new worker(path)路径问题

如题,在new worker时需要传入js文件路径,可是在electron环境中使用出现问.同目录下,recorder.jsworker.js recorder.js中调用 var path = './worker.js'; var worker = new worker(path); // 运行时worker.js404 这个地方需要用到node里面的__dirname var path = `${__dirname}/worker.js`; var worker = new worker(p

Electron中Jquery的引入方式

原文链接http://huisky.com/blog/16122220522957 Electron默认启用了Node.js的require模块,而jQuery等新版本框架为了支持commondJS标准,当Window中存在require时,会启用模块引入的方式,导致报错 Uncaught ReferenceError: $ is not defined,本文研究了高低版本jQuery引入的正确方式. 1. 报错原因 Electron默认启用了Node.js的require模块,而jQuery等

js中的webworker

js中的webworker webworker的作用类似于java的多线程以独立文件的形式运行webworker index.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-sc

在electron中使用sqlite：sql.js简介

在electron中使用sqlite:sql.js简介在开发electron应用的时候如果想要使用sqlite3,步骤上除了npm安装以外还要rebuild,比较麻烦.如果你想找一个开箱即用的sql库,那么sql.js将是个不错的选择.sql.js是sqlite的Webassembly版,使用上和sqlite基本没有区别. sql.js支持浏览器端直接引入cdn,也支持npm导入. 不过如果用import语句导入的话要注意不推荐直接导入sql.js,这样导入的是sql-wasm.js文件,即W

electron中使用adm-zip将多个excel文件压缩进文件夹，使用XLSX以及XLSXStyle生成带样式excel文件

需求:electron环境下想要实现根据多个表生成多个Excel文件,打包存入文件夹内并压缩下载到本地.(实际场景描述:界面中有软件工程一班学生信息.软件工程二班学生信息.软件工程三班学生信息,上方有"一键生成"的按钮,点击时弹出文件存储位置选择框选择压缩包所要保存的位置,选择完成后点击保存后生成压缩包中存放一.二.三班三张对应班级学生信息Excel的文件.)注:生成的Excel文件需要按照对应模板进行显示(合并单元格.修改excel单元格的高度和宽度...) 思路:使用electro

Electron中git, npm，webpack使用

开始学习Electron的时候用到git, 记录学习一下, 学习地址是: https://zhuanlan.zhihu.com/p/20225295?columnSlug=FrontendMagazine 1. 用git的时候进入一个目录是 cd D:test 可以进入d盘的文件路劲,跟git没关系 2. 打开 Git bash here Jason Zeng@DESKTOP-ODB5KQB MINGW32 /e/Jason Zeng/Desktop/Electron$ git clone h

在Electron中通过ffi模块实现JavaScript调用C++动态库

目前在网上能搜到的JS调C++动态库的实现有两种,一种是通过开发Node.js addon模块的方式实现调用,这种对于我们已有的代码实现比较复杂,需要大量的开发,因此不适用:另一种是通过FFI模块,FFI的全称是Foreign Function Interface,该项目生来就是解决NodeJS的本地调用问题的,其流程就相当于Windows下的LoadLibrary()和GetProcAddress(),亦可以理解为NodeJS下的平台调用. 1.安装ffi模块.ffi模块需要使用http://

Electron中使用sql.js操作SQLite数据库

推荐sql.js——一款纯js的sqlite工具. 一.关于sql.js sql.js(https://github.com/kripken/sql.js)通过使用Emscripten编译SQLite C代码,将SQLite移植到Webassembly. 它使用存储在内存中的虚拟数据库文件,因此不会保留对数据库所做的更改. 但是,它允许您导入任何现有的sqlite文件,并将创建的数据库导出为JavaScript类型的数组. 这里没有C绑定或node-gyp编译,sql.js是一个简单的JavaS

在Electron中最快速预加载脚本

背景在Electron打开新窗口的时候,提前加载一段JavaScript脚本,以此内置一些属性或接口给被打开的页面.之所以要以注入方式,而不是页面自己引用,原因是不想麻烦页面自行引用,不想修改旧有的业务逻辑. 方法一一开始是想在打开BrowserWindow后,执行executeJavaScript方法来给相应的窗口注入脚本. 不过这个方法虽然可以在相应的窗口注入脚本,但是它的执行的顺序太后,无法在页面加载时加载到,就导致了如果页面的在加载时使用了注入接口,就会有调用不到问题. 所以这个方法

关于electron中入口文件main.js一些重要参数（持续更新maybe）

const {app, BrowserWindow} = require('electron') const path = require('path') let mainWindow function createWindow () { console.log(123) mainWindow = new BrowserWindow({ width: 900, height: 600, webPreferences: { preload: path.join(__dirname, 'preloa

electron中JS报错：require is not defined的问题解决方法

Electron已经发布了6.0正式版,升级后发现原来能运行的代码报错提示require is not defined 解决办法: 修改创建BrowserWindow部分的相关代码,设置属性webPreferences.nodeIntegration为 true let win = new BrowserWindow({ webPreferences: { nodeIntegration: true } }) 在原有的new BrowserWindow基础上加入 webPreferences:

electron中引入jquery

<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>  <script src="scripts/jquery.min.js">&l

前端魔法堂：可能是你见过最详细的WebWorker实用指南

前言 JavaScript从使用开初就一直基于事件循环的单线程运行模型,即使是成功进军后端开发的Nodejs也没有改变这一模型.那么对于计算密集型的应用,我们必须创建新进程来执行运算,然后执行进程间通信实现传参和获取运算结果.否则会造成UI界面卡顿,甚至导致浏览器无响应. 从功能实现来看,我们可以通过新增iframe加载同域页面来创建JSVM进程执行运算从而避免造成界面卡顿的问题.但存在如下问题: 这里涉及到HTML页面.JavaScript.iframe同源策略.iframe间消息通信的综合应

第二章你第首个Electron应用　| Electron in Action(中译)

本章主要内容构建并启动Electron应用生成package.json,配置成Electron应用在你的项目中包含预先构建Electron版本配置package.json以启动主进程从主进程生成渲染进程利用Electron限制宽松的优点构建通常在浏览器无法构建的功能使用Electron的内置模块来回避一些常见的问题在第一章中,我们从高的层次上,讨论了什么是Electron.说到底这本书叫做<Electron实战>,对吧?在本章中,我们通过从头开始设置和构建一个简单的应用程序来管

第一章 Electron介绍 | Electron in Action(中译)

Github 官方地址代表作: Visual Studio Code Atom - Code editor. Github开源的代码编辑器,Electron起源地 Visual Studio Code - Cross-platform IDE. 近几年最火的代码IDE Hyper - Terminal. 3万多星的命令行窗口,慌了! 其他本章主要内容理解Electron是什么学习Electron基于什么技术了解使用Electron和传统Web应用程序有什么不同构建Electron应用

electron之Windows下使用 html js css 开发桌面应用程序

1.atom/electron github: https://github.com/atom/electron 中文文档: https://github.com/atom/electron/tree/master/docs-translations/zh-CN 2.下载 electron-v0.36.5-win32-x64 https://github.com/atom/electron/releases/download/v0.36.5/electron-v0.36.5-win32-x64.

使用 AngularJS 和 Electron 构建桌面应用

GitHub 的 Electron 框架(以前叫做 Atom Shell)允许你使用 HTML, CSS 和 JavaScript 编写跨平台的桌面应用.它是io.js 运行时的衍生,专注于桌面应用而不是 web 服务端. Electron 丰富的原生 API 使我们能够在页面中直接使用 JavaScript 获取原生的内容. 这个教程向我们展示了如何使用 Angular 和 Electron 构建一个桌面应用.下面是本教程的所有步骤: 创建一个简单的 Electron 应用使用 Visual

XCel 项目总结 - Electron 与 Vue 的性能优化

XCEL 是由凹凸实验室推出的一个 Excel 数据清洗工具,其通过可视化的方式让用户轻松地对 Excel 数据进行筛选. XCEL 基于 Electron 和 Vue 2.0 进行开发,充分利用 Electron 多进程任务处理等功能,使其拥有高性能.跨平台(windows 7+.Mac 和 Linux)的特性. 落地页:https://xcel.aotu.io/ ✨✨✨ 项目地址:https://github.com/o2team/xcel ✨✨✨ 项目背景用户研究的定量研究和轻量级数据处

【Electron】Electron开发入门（四）：操作PC端文件系统

一.调用PC端默认方式打开本地文件在main.js里 // 打开系统本地文件或者网页链接 const {shell} = require('electron'); // Open a local file in the default app var path1 = "d:\\ProjectsSpace\\ElectronProjects\\ElectronTest2\\app\\html\\config\\record.txt"; shell.openItem(path1); //

【Electron】Electron开发入门（三）：main process和web page 通信

一.main process 和 web page 通信 electron框架主进程(Main Process)与嵌入的网页(web page,也就是renderer process)之间的通信 Main.js里添加代码 //通信模块,mian process与renderer process(web page) const {ipcMain} = require('electron') //监听web page里发出的message ipcMain.on('asynchronous-messa

使用 electron 做个播放器

使用 electron 做个播放器本文同步更新在:https://github.com/whxaxes/blog/issues/8 前言虽然 electron 已经出来好长时间了,但是最近才玩了一下,写篇博文记录一下,以便日后回顾. electron 的入门可以说是相当简单,官方提供了一个 quick start,很流畅的就可以跑起来一个应用.因此,如何入门就不赘述了,直接说一下如何做个播放器. 为啥要做个播放器呢,因为我在很久很久以前写过一个网页版的音频可视化播放器,但是因为是在页端,所以

electron中使用webworker

热门专题