Electron + React: Clear fs module - node.js

I have an Electron + React app based on create-react-app. In the React code, I'd like to use excel4node to generate an Excel file. The issue is that excel4node tries to import modules such as fs and http which are not available on the renderer side. This results in the following Webpack error:
[0] ERROR in ./node_modules/image-size/dist/index.js 7:11-24
[0] Module not found: Error: Can't resolve 'fs' in 'C:\[...]\node_modules\image-size\dist'
I do not want to use any methods from excel4node which are accessing these modules, such as writing the Excel file to disk for example -- I would be fine with these functions erroring if they were called.
Is it possible to overwrite the problematic modules with something like an empty module just so that the import works? Since I used create-react-app I do not have easy access to the webpack configuration, so if there is a different way that I would prefer that.

Related

How to import from a bundle created in webpack?

I'm working on a project that's based on a given sample project that uses a package named Seeso.
The sample project uses the 'cross-env' and 'parcel-bundler' packages which are both deprecated, and I would like to replace them with pure node.
I managed to create a backend that statically serves requested files and thus handles imports,
but the Seeso package seems to dynamically resolve its imports using a webpack bundle (I have little to no knowledge of webpack but not even a configuration file is present; just the bundle), and I get the following error after I changed the import path of Seeso in the easy-seeso.js file to its actual path:
Uncaught SyntaxError: The requested module '/external_modules/seeso/dist/seeso.js' does not provide an export named 'CalibrationAccuracyCriteria' (at easy-seeso.js:2:34)
because of
import Seeso, {InitializationErrorType, CalibrationAccuracyCriteria} from '/external_modules/seeso/dist/seeso.js';
How can I import the needed Seeso files from the webpack bundle with minimum work and understanding of webpack as possible? (Preferably without running webpack commands before running - would like to run 'node server.js' and that's it)
Here is the sample project:
https://github.com/visualcamp/seeso-sample-web

Flutter In_App_Purchase Error: Error [ERR_REQUIRE_ESM]: change require() of ES Module \node_modules\camelcase-keys\index.js to dynamic import()

I am trying to setup Flutter In_App_Purchase (The offical Flutter In_App_Purchase Package) and I run into a problem with the firebase-backend. Whenever I try to deploy it, I run into the following error:
Failed to load function definition from source: Failed to generate manifest from function source: Error
[ERR_REQUIRE_ESM]: require() of ES Module C:\Users\larak\Desktop\Fashionbook\FashionLookbook_FlutterIAP_Backend-IAP\firebase-backend\functions\node_modules\camelcase-keys\index.js from C:\Users\larak\Desktop\Fashionbook\FashionLookbook_FlutterIAP_Backend-IAP\firebase-backend\functions\lib\app-store.purchase-handler.js not supported.
Instead change the require of index.js in C:\Users\larak\Desktop\Fashionbook\FashionLookbook_FlutterIAP_Backend-IAP\firebase-backend\functions\lib\app-store.purchase-handler.js to a dynamic import() which is available in all CommonJS modules.
I think it's related to this line in app-store.purchase-handler.ts:
import camelCaseKeys from "firebase-backend/functions/scr/camelcase-keys";
Full example code here: https://github.com/flutter/codelabs/tree/master/in_app_purchases/complete/firebase-backend
I tried to change it as described in the error message, but I wasn't able to achieve it. I have zero experience with TypeScript. I'm a Flutter developer and I usually use Node.js with JavaScript.

Why is IE11 giving me an error for node-fetch using fetch in the node modules folder?

My React site isn’t loading in IE11 because the node-fetch module uses fetch in the node module folder browser.js file. Although I’m not using node-fetch outside of node, IE is giving me an error because of the fetch being used in that browser.js file. If I import isomorphic-fetch into the node module file it works, but altering the file is not ideal. It also works if I import isomorphic-fetch in app.js, but it seems like I’m missing something.
Why is IE giving me an error?

How to use named imports (ES 6) in NodeJS 14.x?

I have code which I like to use inside nodejs (14.4) and the browser. For this code to work inside nodejs I need named imports like
import {Vector3} from "three;
ES 6 modules in general are working fine with the following changes:
package.json:
"type": "module",
An launching nodejs with --experimental-specifier-resolution=node so I don't have to specify file extensions. But for named imports nodejs still prints out:
SyntaxError: The requested module 'three' is expected to be of type CommonJS, which does not support named exports.
There is a Stackoverflow post suggesting the usage of esm package loader. Unfortunately it has a bug making TypeScript "reflect-metadata" unusable (Issue: https://github.com/standard-things/esm/issues/809) So I can't use that.
TL;DR; How can I enable named ES 6 modules in nodeJs 14.4 without ESM package loader? type: module and launch arg are already set.
This may not be the perfect answer but I solved my problem by switching the code base to Type Script (TS):
For browser, I can configure ts to use es 6 modules
For node, I can configure ts to use node modules
--> Everybody is happy

HTML parser for node typescript

I am creating a node.js application written in Typescript. Its one of the functionality is to parse HTML file. But I can't seem to find the HTML parser written in Typescript.
As, normal npm modules specified in HTML-parser on Node.js are not importing in my application.
I have tried installing the node.js module like
npm install domhandler
and, then imported the module in my main.ts file like
import * as parser from "htmlparser2"
It was throwing error
Cannot find module 'htmlparser2'
Is there any way I can import these normal npm modules in my Typescript node application?
Or, is there any typescript module which I can use to parse HTML file?

Resources