Simple question, I'm trying to use electron and I need to get the remote object on the client.
Doing
const {BrowserWindow} = require('electron').remote; // Works
But
import {BrowserWindow} from 'electron/remote' // Does not work
New to ES6 classes just unsure why this is not working. Thanks.
You can only import from modules. electron/remote is not a module, but remote is part of the module electron, so you can write :
import remote from "electron";
And then you can do :
const {BrowserWindow} = remote;
But your first code works fine !
You can read more on import statement here
Hope this helps
I think you're supposed to use it like this:
import {remote} from 'electron'
// do something with remote.BrowserWindow
Related
Sorry if this is a repost/duplicate.
I'm needing some guidance with converting this require statement to an import statement.
I'm using the mailchimp API which has a require statement documented.
const mailchimpClient = require("mailchimp_transactional")("YOUR_API_KEY");
I need to convert this to an import statement as I'm using NestJS and eslint doesn't like require.
Thanks in advance.
import mailchamp from 'mailchimp_transactional'
const mailchimpClient = mailchimp("YOUR_API_KEY")
or
import * as mailchamp from 'mailchimp_transactional'
const mailchimpClient = mailchimp("YOUR_API_KEY")
depending on how your tsconfig looks like.
I'm learning react and I'm trying to implement an npm package called face-recognition in my react project.
But it looks like that their documentation is for nodejs. I've looked into the source code of the package which seems that it doesn't export any module so I just imported it. But still, my console is giving me the error ModuleNotFoundError
Inshort: Can I use this face-recognition library in my react.js?
Here is my live code in codesandbox
Below is the raw code of the same file.
import React from "react";
import "face-recognition";
import image1 from "./assets/fFace.jpg";
import image2 from "./assets/mFace.jpg";
const Home = () => {
const imageOne = image1;
const win = new fr.ImageWindow();
// display image
win.setImage(imageOne);
const detector = fr.FaceDetector(imageOne);
// detect all faces
const faceRectangles = detector.locateFaces(imageOne);
return (
<>
<h1>Face Recognition</h1>
{faceRectangles}
</>
);
};
export default Home;
From the npm page
This package is pretty much obsolete. I recommend you to switch to face-api.js, which covers the same functionality as face-recognition.js in a nodejs as well as browser environment.
In typescript I am using flatbuffers like this:
import {flatbuffers} from 'flatbuffers';
const builder = new flatbuffers.Builder(1);
then I compile to js to be use with react-native:
const flatbuffers_1 = require("flatbuffers");
const builder = new flatbuffers_1.flatbuffers.Builder(1);
but I get error:
undefined is not an object (evaluating 'new flatbuffers_1.flatbuffers.Builder')
What happen?
Not a direct solution, but I'm using the more modern approach/ ES6 imports, and its working fine when I do the following:
import {flatbuffers} from "flatbuffers";
const builder = new flatbuffers.Builder(6000);
// ...
Though I had to modify the code gen output in the generated class from import * as flatbuffers from 'flatbuffers'; to import {flatbuffers} from 'flatbuffers';
Hey I am doing a small project using react-app and I
have been trying all day to create export for this module.
I have installed it with npm, and i want to edit it so i can import and use it in my app.js
I have tried to define "reddit" using class\function\let and use either:
export default
module.exports
And either
import reddit from 'reddit.js';
var reddit = require('reddit.js');
And trying to check with a simple function from the module:
console.log(reddit.hot('cats'));
But I am still getting:
Uncaught TypeError: reddit.hot is not a function
I am a bit lost, what am I doing wrong?
The module uses window.reddit global variable. Don't override it!
So if you are on client side, just use:
require('reddit.js')
//...
reddit.hot('cats')
For server side - you have to do some trick to make it work, because on server side you don't have 'window' global variable.
Upd:
Example of back end usage:
const window = {};
const r = require('./reddit.js') // You don't really use r
const reddit = window.reddit;
reddit.hot('cats')
Reddit does not export anything because it was mainly designed to be added as a script tag!
// So for CommonJS module:
require('reddit.js');
//And for ES6 modules
import 'reddit.js';
And you you will be able to access reddit and reddit.hot() method through the window object.
To learn the new ES6 syntax, I've been trying to refactor some JS code.
I'm absolutely confused though by the whole import / export methods.
How do I change this require statement into ES6?
var remote = require('electron').remote
I've seen this answer but:
It doesn't work
It doesn't really seems to be much ES6-sque
Any thoughts?
It seems imports are not implemented in either Node 6 or Chrome 51 so Electron also does not support them, according to this post: https://discuss.atom.io/t/does-electron-support-es6/19366/18
And also the last electron doc doesn't use imports, they use destructuring syntax:
const { BrowserWindow } = require('electron').remote
// or
const { remote } = require('electron')
const { BrowserWindow } = remote
http://electron.atom.io/docs/api/remote/
But you can use babel with the require hook:
http://babeljs.io/docs/usage/require/
To be auto compile each required modules so you will be able to use imports.
Of course the script given to electron (the one that require babel) is not compiled so you need to make a bootstrap:
// bootwithbabel.js
require("babel-register");
require( process.argv.splice(2) );
In shell (sh):
electron bootwithbabel.js app.es
alias electrones="electron bootwithbabel.js "
electrones coron.es // ^^
Then in your app you can then write:
import electron from 'electron';
import { remote } from 'electron';
You can also import only the remote module:
import { remote } from 'electron';
But you can only import both in one statement:
import electron, { remote } from 'electron'
electron.ipcRenderer.on();
let win = new remote.BrowserWindow({width: 800, height: 600});
remote.getGlobal(name)
playground
I'm absolutely confused though by the whole import / export methods.
Mixing different module systems can indeed be confusing.
It doesn't work
const electron = require('electron');
const remote = electron.remote;
is exactly the same as what you have
var remote = require('electron').remote
If yours work, the other will as well. However, I would simply stick with yours.
It doesn't really seems to be much ES6-sque
Who cares? Node doesn't support ES6 imports and exports natively and it's not super clear how CommonJS modules should map to ES6 modules. I recommend to stick with require if you are only writing for Node anyway.
You could try to do
import electron from 'electron';
const {remote} = electron;
These days every version of Electron comes with basic typescript support. So if you use a TS or TSX file in your project -then you can use ES Import statements inside that file. Whether you use an ES module or not.
https://www.electronjs.org/blog/typescript