We Keep Coding

cannot use import statement outside a module on built exe with electron-forge

I am creating an app with Electron and Vue (using js not ts).
When I run the app using npm run electron:serve the app runs fine.
I now want to build a Windows exe so I can distribute my app. I have tried using electron-builder, electron-packager and electron-forge. Whenever I can get the build to finish, running the exe throws the cannot use import statement outside a module error (referring to the first import statement it finds, i.e. import { app, protocol, BrowserWindow } from 'electron').
I've tried adding "type":"module" to my package.json but (due a bug in Vue, according to this question), that throws Error [ERR_UNSUPPORTED_ESM_URL_SCHEME]
I've also tried changing all my import statements to require but this doesn't work because some of the node modules I'm using use import and the error just throws for those instead.
I'm tearing my hair out over this. Where do I go from here?
UPDATE:
I have found a workaround for the Vue bug and posted my findings on the linked question. I can now add "type":"module" to my package.json.
However, I now get an error thrown when I run npm run electron:serve and from my built exe:
Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: <my_project_root>\dist_electron\index.js
require() of ES modules is not supported.
require() of <my_project_root>\dist_electron\index.js from <my_project_root>\node_modules\electron\dist\resources\default_app.asar\main.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
To be clear, I'm not using require in any of my source code, but the compiled(?) version does?
What's going on here?
UPDATE 2:
As requested, here is a minimal reproducible example that maintains original folder structure, configs and package.json

Webpack 5 - quiet warnings originating from node_modules?

I'm using webpack 5.44.0 and webpack-dev-server 3.11.2, and a custom webpack/babel config in my react project. I'm importing esri-leaflet-geocoder into my project. When developing with webpack dev server, I get this warning:
WARNING in ./node_modules/esri-leaflet-geocoder/node_modules/esri-leaflet/src/EsriLeaflet.js 2:0-51
Should not import the named export 'version' (reexported as 'VERSION') from default-exporting module (only default export is available soon)
# ./node_modules/esri-leaflet-geocoder/dist/esri-leaflet-geocoder-debug.js 5:102-125
# ./src/index.tsx 34:0-31
I read the question Error: Should not import the named export 'version' (imported as 'version'), which seems to be the most closely related. But in my case, ther issue is buried within the external module of esri-leaflet-geocoder, so I really don't have any control over the code in it.
Is it possible to tell webpack dev server to ignore this specific kind of warning, or any warning that originates from within the node_modules folder? I want to keep warnings from within my own code, but not print warnings if they're caused by code in a node_module. Is this kind of granular control over warnings possible in webpack? How can I ignore this warning?

Installing and Using React from React repo

I have a very basic question: I'm required to install and use react through the artifact files here. I downloaded the two files as seen in my directory. I'm using babel as my transpiler. I'm aware there are better ways to go about install react via npm, script file locations, etc but I have to do it this way. Here's a picture of my directory -
I feel like I have the relevant scripts and imports everywhere but I'm getting these errors -
app.js:1 GET http://localhost:3000/public/react.development.js net::ERR_ABORTED 404 (Not Found)
app.js:2 GET http://localhost:3000/public/react-dom.development.js net::ERR_ABORTED 404 (Not Found)
I seem to have an error from actually reading the two .js files I downloaded from the repo itself as well as the location of those files when calling them in my app.jsx. I've included the script files to run in my index.html file
<script src='react-dom.development.js'></script>
<script src='react.development.js'></script>
In my app.jsx I have these import statements
import React from '../public/react.development.js';
import ReactDOM from '../public/react-dom.development.js';
Obviously, I'm doing something wrong here. I'm not sure why I'm getting a 404 finding the files even though the given path is correct but it's still wrong somehow?

Make Webpack 1.13 work with ES6 vendor

I am trying to add some external dependency cryptowatch-embed js to my webpack project (of version 1.13.3) as vendor. The concern is that this dependency is written in ES6 style and js file ends with something like export default Embed;. When I run my webpack-dev-server and open the browser the console shows me Uncaught SyntaxError: Unexpected token export on this line. I suppose that webpack does not bundle ES6 vendor properly, but I dot'n have any ideas what should be done to fix this error. So the main question is how can I make webpack work with /node_modules/cryptowatch-embed/src/main.js that is written in ES6?

How to correct NodeJS Cannot find installed package?

Just went through the Tour of Heroes tutorial for Angular2 and was really enjoying the NPM system then I went to add my first package.
I added "eveonlinejs": "^2.0.0" to my package.json and ran "npm install"
The package installed and the folder is present in node_modules.
Running my server however results in.
app/eveapi.service.ts(2,29): error TS2307: Cannot find module 'eveonlinejs'.
The line in question is
import { eveonlinejs } from 'eveonlinejs';
From my research I believe that the import should hit the package.json in the "node_modules/eveonlinejs" directory and see the "main" property which is set.
I have tried deleting clearing the NPM cache and reinstalling the node_modules folder.
I have also tried using a require statement to point into the directory but then I get a missing module for "sax" which is installed inside the "eveonlinejs" directory.
Update:
Thanks to #nem035 I've gotten a bit futher and have stopped using import however found I was getting a 404 error when using require.
I was able to get a step further by adding this code:
systemjs.config.js
'eveonlinejs': 'npm:eveonlinejs/lib/eveonline.js'
Which got me back to having errors with "sax." I found that Sax has, for some reason, moved out of the eveonlinejs folder up to the root node_modules folder.
'sax': 'npm:sax/lib/sax.js'
This corrected the Sax issue however gave me all this!
zone.js:1382 GET http://localhost:3000/node_modules/eveonlinejs/lib/client 404 (Not Found)
dashboard:17 Error: (SystemJS) XHR error (404 Not Found) loading http://localhost:3000/node_modules/eveonlinejs/lib/client
zone.js:1382 GET http://localhost:3000/node_modules/eveonlinejs/lib/cache/cache 404 (Not Found)
zone.js:1382 GET http://localhost:3000/node_modules/eveonlinejs/lib/cache/file 404 (Not Found)
zone.js:1382 GET http://localhost:3000/node_modules/eveonlinejs/lib/cache/memory 404 (Not Found)
zone.js:1382 GET http://localhost:3000/stream 404 (Not Found)
zone.js:1382 GET http://localhost:3000/string_decoder 404 (Not Found)
Everyone of these I fix reveals another‽ If this is what NodeJS is like then I'm out. Haha!

First thing you should do is remove the {} around your import.
import { eveonlinejs } from 'eveonlinejs';
// ----^-------------^-------------------- Remove the curly braces
You probably want this
import eveonlinejs from 'eveonlinejs';
The reason is because wrapping {} around the import tries to extract a named export from the file, but you want the whole library.
// import { eveonlinejs } from 'eveonlinejs' expects export code as
export {
eveonlinejs
}
When you leave out the braces, the import tries to extract the default export.
// import eveonlinejs from 'eveonlinejs' expects import as
export default eveonlinejs
Now, if you're using the version of eveonlinejs that's is currently on github, this might not work depending on how you're transpiling your modules (and how this process deals with module.exports).
The safe way would be to just use require:
var eveonlinejs = require('eveonlinejs');