We Keep Coding

Cannot import App.jsx in express || Error [ERR_MODULE_NOT_FOUND]: Cannot find module

I am trying to ssr my react app and it's been months trying, but all I get is this error:
Error [ERR_MODULE_NOT_FOUND]: Cannot find module 'F:\ReactApp\client\src\App'
imported from F:\ReactApp\server\express.js
at first I tried to require it as so
const App = require('../client/src/App')
but I got this error :
Cannot find module '../client/src/App'
so i used module type to use import instead of require as so:
import App from '../client/src/App'
I checked the similar questions but none have worked!
Directory Structure:
Any Ideas?

Get syntax error when trying to import amCharts modules

i am trying to use amcharts through npm, i run the command npm install#amcharts/amcharts4 in the i can see that now in my node modules and in my package.json i have all the modules associated with the amcharts, also my package.json got updated and now inludes this line "#amcharts/amcharts4": "^4.10.22", i have created two files an index.html and a charts.js. At the top of my app.js i added the following lines
import * as am4core from "#amcharts/amcharts4/core";
import * as am4charts from "#amcharts/amcharts4/charts";
import am4themes_animated from "#amcharts/amcharts4/themes/animated";
when i try to include my charts.hs in my index.html with the following script
<script src="charts.js"></script>
i get the same syntax error all the time and i still cant find a way to resolve it
"Uncaught SyntaxError: Cannot use import statement outside a module
"
does anyone have any idea what i am doing wrong? thanks in advance

How to integrate javascript libraries into react?

I have two javascript libraries that I need to integrate into my React app. First I tried this:
import d3 from "https://d3js.org/d3.v4.min.js"
import techan from "http://techanjs.org/techan.min.js"
That produced error:
./src/components/CandlestickChart/CandlestickChart.jsx Module not
found: Can't resolve 'http://techanjs.org/techan.min.js' in
'C:\Users\Greg\Projects\react-demos\my-react-splitter-layout\src\components\CandlestickChart'
So I went to http://teckanjs.org/techan.min.js, copied the code, ran it through a beautifier, and saved it to techan.js, located in the same folder as CandlestickChart.jsx. I changed import to
import techan from "./techan.js"
Then I got similar error:
./src/components/CandlestickChart/CandlestickChart.jsx Module not
found: Can't resolve 'http://techanjs.org/techan.min.js' in
'C:\Users\Greg\Projects\react-demos\my-react-splitter-layout\src\components\CandlestickChart'
So I did the same thing as with the other one and changed the import to:
import d3 from "./d3.v4.js"
Then I got error:
./src/components/CandlestickChart/d3.v4.js Module not found: Can't
resolve './requirejs' in
'C:\Users\Greg\Projects\react-demos\my-react-splitter-layout\src\components\CandlestickChart'
So I found requirejs online and did the same thing as the others and added an import to d3.v4.js like this:
import requirejs from "./requirejs";
But still getting the same error. What's the trick to this?

Install it as a local package. Run the following:
npm install d3
Then you'll be able to import it in your JavaScript:
import * as d3 from "d3";
Note the "d3", not the "./d3" - the lack of the ./ indicates that you want to install from a module package, not from a file in the same directory.

Using imports with Nodejs doesn't recognize a default export

I'm using expo-server-sdk, and I haven't had this issue with other packages yet, but I'm thinking that this isn't an issue specific to this package.
Basically, my IDE recognises that this package has a default export, and correctly autoimports it as,
import { Expo } from 'expo-server-sdk';
The problem is that this doesn't compile and throws the error,
SyntaxError: The requested module 'expo-server-sdk' does not provide an export named 'Expo'
I'm using the experimental ESM module loader with Node v13.13.0. When I initially set up the config and environment, I was able to use import instead of require, however I am supposed to append the extension of each file I import.
What can be wrong here?
Expo post for reference

If it's exported as default you only need
import Expo from 'expo-server-sdk';
instead of
import { Expo } from 'expo-server-sdk';

I managed to work around this by doing the following:
import Expo from 'expo-server-sdk';
...
let expo = Expo.Expo()
...
if (!Expo.Expo.isExpoPushToken(pushToken)) {
...
}
...
Just import Expo from 'expo-server-sdk'; did not work.

How to import PDF.JS into Typescript using npm

I installed the PDF.JS npm packages and import the same in typescript file, but it does not work as expected. I used the below code to import the PDF.JS into typescript.
import { PDFJSStatic } from 'pdfjs-dist';
const PDFJS: PDFJSStatic = require('pdfjs-dist');
PDFJS.getDocument('helloworld.pdf').then(console.log);
and I am getting the error
Severity Code Description Project File Line Suppression State
Error TS2307 Cannot find module 'pdfjs-dist'. app.ts 2 Active
Severity Code Description Project File Line Suppression State
Error TS2304 Cannot find name 'require'. app.ts 3 Active
please provide your valuable suggestion and let me know what I am missed in it if any.

App structure really matters while importing any modules,
you need to import this first into your root level ts file
app.module.ts and even in tsconfig.app.json.