electron | 易学教程

Call renderer process from React-Redux action (Electron)

阅读更多关于 Call renderer process from React-Redux action (Electron)

I have a electron application which uses React & Redux, so I have action creators, reducers etc. I also have a function in my renderer file (nodejs) which does some async stuff. I want to call this function from within my action creator. I guess I will have to use redux-thunk for this or some other async library, however, I am not quite sure how to access this function in the renderer process and use it in my react.redux app? So e.g. for the action creator: export const downloadFromYoutube = (download) => { //I want to call the function here }; and my renderer file only contains this one

electron原来这么简单----打包你的react、VUE桌面应用程序

阅读更多关于 electron原来这么简单----打包你的react、VUE桌面应用程序

也许你不甘心只写网页，被人叫做“他会写网页”，也许你有项目需求，必须写桌面应用，然而你只会前端，没关系。网上的教程很多，但是很少有能说的浅显易懂的，我尽力将electron打包应用说的清晰明了，希望能你在写自己的应用的时候，感到心中有数。话不多说，进入正题：一、安装electron 为了方便你以后的使用，建议全局安装。以后在任何文件夹都能使用electron。怎么安装就不废话了，不会的去官网，安装好electron之后也安装一个专用的打包工具electron-packager，以方便我们后面打包的时候使用。二、run build 你的react项目写完后（其实写到一半，四分之一你随意，只要页面上有点内容了），执行 npm run build,会在build文件夹下面生成如下图所示的结构：这时候，你试着点击index.html看看（无需放到服务器静态资源目录），如果能看到内容，就是ok的，如果一片白屏，控制台没错误提示，那么你只要在package.json里面添加一个"homepage":'./',再次执行build，就可以看到内容了。如果你index.html没内容，就不要往下继续了，检查你的项目是否存在路径问题。三、创建入口文件和配置基于之前index.html已经能正常展示的前提下，在你项目build文件夹中创建以下2个文件 main.js const

How do i disable the horizontal scroll bar in Electron BrowserWindow?

阅读更多关于 How do i disable the horizontal scroll bar in Electron BrowserWindow?

问题 How do i disable the horizontal scroll bar in a fixed width and height browser window in Electron? Thank you. 回答1: I think you just have to disable horizontal scrolling in your HTML file. One way to do so is by using css: <style> body { overflow-x: hidden; } </style> Try to add this in the <head>. 回答2: Try to add this in your CSS ::-webkit-scrollbar { display: none; } 来源： https://stackoverflow.com/questions/44990519/how-do-i-disable-the-horizontal-scroll-bar-in-electron-browserwindow

Managing application settings in an Electron application

阅读更多关于 Managing application settings in an Electron application

I'm curious to know how can one manage application settings in an Electron application ? I have found some excellent resources here ( Where to store user settings in Electron (Atom Shell) Application? , for example) and elsewhere when it comes to managing user settings but couldn't find anything related to managing application settings. To me, the difference between the two is that application settings could vary from environment to environment (dev/test/production) but would remain the same for all users of the application. They would contain things like API endpoints etc. User settings on

Firebase database looses websocket connection which results in delays

阅读更多关于 Firebase database looses websocket connection which results in delays

问题 We are using Firebase Realtime Database in our Electron application. Executing "set" or "update" the first time after authentication works flawlessly. However, after waiting some time (idle > one minute), executing a update or set operation is delayed by 30 seconds up to 2 minutes. We are executing the following snipped in a promise: this.$fbDb.ref().update(updatedNodes).then(() => { console.log('Successfully created configuration.') resolve() }).catch((err) => { reject(err) }) The firebase

fs module fails when integrating Electron into Angular project

阅读更多关于 fs module fails when integrating Electron into Angular project

问题 I have some trouble integrating Electron. When I use it as described in this blog post, everything works. Problems start when I want to use import Electron (electron.remote) to use it in Angular2 service to let the app using the desktop features like system dialogs and file system access. I get the following error when loading the app, in electron/index.js which is included in webpack bundle: Uncaught TypeError: fs.existsSync is not a function (index.js:6) The file looks quite simple: var fs

Node.js recursively list full path of files

阅读更多关于 Node.js recursively list full path of files

Good night everyone. I'm having trouble with probably some simple recursive function. The problem is to recursively list all files in a given folder. For the moment, I've managed to list files in a directory using a simple function : fs.readdirSync(copyFrom).forEach(file => { let fullPath = path.join(copyFrom, file); if (fs.lstatSync(fullPath).isDirectory()) { console.log(fullPath); } else { console.log(fullPath); } }); I've tried various methods like do{} ... while() but I can't get it right. As I'm a beginner in javascript, I finally decided to ask for help to you guys. Thanks in advance for

Electron - How to load a html file into the current window?

阅读更多关于 Electron - How to load a html file into the current window?

问题 I was looking all around: docs, google, etc., on how to load a html file in the main window of an electron app, but I can't find a way. Is it really this complicated or dead simple? With what I have came up is ajax, thus works: $("#main").load("./views/details.html"); Another method I have found is via remote: const {BrowserWindow} = require('electron').remote let win = new BrowserWindow({width: 800, height: 600}) win.loadURL('https://github.com') But this opens always a new window, and I

What does {app, BrowserWindow} means in JavaScript (node.js)?

阅读更多关于 What does {app, BrowserWindow} means in JavaScript (node.js)?

问题 While reading docs of making softwares with electron, I came across this type of code in the beginning of index.js file (the file where generally execution starts) const {app, BrowserWindow} = require('electron') What does {app, BrowserWindow} (the syntax, not the keywords) really means? Is it a JavaScript syntax, or a node.js thing or something exclusively related to electron? 回答1: This syntax is called 'object destructuring', and it is a feature of the latest version of JavaScript

electron起步

阅读更多关于 electron起步

1、安装node.js 2、安装淘宝镜像　　 npm install -g cnpm --registry=https://registry.npm.taobao.org 3、安装全局electron 　　 npm install -g electron 4、创建package.json文件　　 npm init 5、若全局安装，则忽视。局部安装命令　　 npm install --save-dev electron 6、package.json内容　　 { "name": "testapp", "version": "0.0.1", "description": "testapp", "main": "main.js", "dependencies": {}, "devDependencies": { "electron": "^7.1.2", "electron-packager": "^14.1.1" }, "scripts": { "start": "electron .", "packager": "electron-packager . haha --platform=win32 --arch=x64 --icon=icon.ico --out=./out --asar --app-version=0.0.1" }, "author": "", "license"