electron “MAIN” : requiring you own js file and call function from it

Question

I'm can't understand some things here related to electron. I've been searching for hours for the magic answer but couldn't find anything.

My goal is simple. I don't want my main electron.js file to be 5000 lines long without any kind of organization so I'm trying to split the code into multiple js file that make sense.

My idea was to use import { someFunction1, someFunction2 } from './scripts/someScript' in my electron.js and then just creating that file with the arrow function in it and export them.

Then I could call the function as I want in the main file. However, it doesn't seem to be possible. I've read electronjs doesn't support ES6 syntax. I've read about Babel (But from what I read, it implies a bunch of additional configuration and I don't want to spend days trying to add this to the bunch of configuration that are already messy with electron + React (No boiler plate here). And I didn't find anything specifics for this combo.

Question is. Is this doable in 2021? Am I missing anything? What would you guys recommend?

File would look something like this:

import { someNodeModuleFunction } from 'someNodeModule';

const someFunction1 = () => {
    return 1;
};

const someFunction2 = () => {
    return 2;
};

export { someFunction1, someFunction2 }

---

EDIT

Here's the actual code I have a problem with. I still get

if the file is.js: "Must use import to load ES Module" If the file is.mjs: "Cannot use import statement outside a module"

This script is simply using fs to create a directory:

DataManagement.mjs:

import { existsSync, mkdir } from 'fs';

const electron = require('electron');
const app = electron.app;

const documentFolder = app.getPath('documents');

const CreateDataDirectory = () => {
   const mainPath = documentFolder + 'AppName'
   if (!existsSync(mainPath)) {
      mkdir(mainPath);
   }
};

module.exports = { CreateDataDirectory } 

Calling it like that in electron.js:

const { CreateDataDirectory } = require('./scripts/DataManagement.mjs');

[...]

CreateDataDirectory()

Not sure how dividing the code can be that hard. :)

Answer 1

You may need to use Node.js module syntax ( require and module.exports ) or Babel (code transpiler).

For example:

import { someNodeModuleFunction } from 'someNodeModule';

const someFunction1 = () => {
    return 1;
};

const someFunction2 = () => {
    return 2;
};

module.exports = { someFunction1, someFunction2 }

Using your module:

const { someFunction1, someFunction2 } = require ('./FILE.js');

// ...

Answer 2

You could use module.exports :

otherModule.js

const someFunction1 = () => {
    return 1;
};

const someFunction2 = () => {
    return 2;
};

module.exports = {
    someFunction1,
    someFunction2
};

main.js

const { someFunction1, someFunction2 } = require('otherModule.js');