React app production build shows js errors - javascript

I've created a client react application using create-react-app. It talks to a node server running an express api. In development everything is working great and was getting ready to deploy.
When running npm run build I get no errors whatsoever either, everything seems to be working great. When build finishes it suggest to run serve -s build , I do this and navigate to my localhost:5000, the first console.logs from my app show up but then suddenly i throws a seemingly simple javascript error:
TypeError: "e.forEach is not a function"
me InboundTab.js:27
me InboundTab.js:36
React 7
unstable_runWithPriority scheduler.production.min.js:270
React 5
getArrivals ArrivalState.js:39
l runtime.js:45
_invoke runtime.js:264
t runtime.js:98
l runtime.js:45
t runtime.js:137
t runtime.js:147
react-dom.production.min.js:4636:12
React 5
unstable_runWithPriority scheduler.production.min.js:270
React 4
unstable_runWithPriority scheduler.production.min.js:270
React 5
getArrivals ArrivalState.js:39
l runtime.js:45
_invoke runtime.js:264
t runtime.js:98
l runtime.js:45
t runtime.js:137
t runtime.js:147
I've been looking all over the internet but can't find any clues on what's going on here. Most sites talk about errors during the build process or a site not showing at all but this is neither. Googling the error seems to say this is some ES6 issue, but I'm running firefox 73 so I'd expect no issues on that front.
As extra info this is my first time trying to deploy react. Funny enough I'd only done small projects so far running locally so I am pretty sure I'm missing something obvious in the build process.
Any help, tips on where to loop will be most appreciated. Thanks!

Answering my own question. I guess I just needed to re-read this error with the nice syntax highlight because the filename and line location took me to the right place.
On my client's api calls I set up the server url as:
const API_SERVER =
process.env.NODE_ENV === "development"
? "http://localhost:4200"
: "http://example.com";
but my example.com isn't setup yet so the error came from not being able to reach the server. Changing the example.com to localhost and re-building made things work.

Related

React native fetch() causing unknown error Error: ENOENT: no such file or directory, open 'C:\root\react-native\ReactAndroid\hermes-engine.cxx\Release

I have made a simple REST API, and I have a react native application where I am trying to call the API with fetch. The server is running on the same computer as the react native application, in my fetch call I used 'fetch('http://10.0.2.2:3000/Users)' which from what I know is the correct way to call it. When I run my react-native application to test if the connection works, I get the following error:
Error: ENOENT: no such file or directory, open 'C:\root\react-native\ReactAndroid\hermes-engine.cxx\Release\21w5t5f5\x86_64\lib\InternalBytecode\InternalBytecode.js'
at Object.openSync (node:fs:584:3)
at Object.readFileSync (node:fs:452:35)
at getCodeFrame (C:\Users\brayd\projects\startscreentest\node_modules\metro\src\Server.js:1004:18)
at Server._symbolicate (C:\Users\brayd\projects\startscreentest\node_modules\metro\src\Server.js:1073:22)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async Server._processRequest (C:\Users\brayd\projects\startscreentest\node_modules\metro\src\Server.js:437:7) {
errno: -4058,
syscall: 'open',
code: 'ENOENT',
path: 'C:\root\react-native\ReactAndroid\hermes-engine.cxx\Release\21w5t5f5\x86_64\lib\InternalBytecode\InternalBytecode.js'
Has anyone got this error before and know of a a solution? Would really appreciate some help with this, I have been tried almost everything I can think of and at this point I am lost as to what I should do.
I have never seen this error before, I have looked online to see if anyone has posted a solution and found nothing, I have no idea how to solve this error, I have been debugging for hours, and have tried countless things including changing the fetch url, making a new application, etc. I know the api works because I have tested all the routes with curl, I know the fetch statements work because I created a js project and tested the fetch statements. For some reason, its just not working on my react-native application, its either giving me the above error, or if I change the url to something else like 'fetch('http://localhost:3000/Users)' it just gives me 'network connection error'.
You have to create a wamp or nginx server on your computer. Then your API project starts on a server. After that, you can access your pc IP address. Actually, your react native simulator doesn't work on your pc. So you can't access the directly pc IP address.

Laravel Vuejs Uncaught (in promise) ChunkLoadError: Loading chunk blogs-component failed

I have a Laravel + Vuejs project and while everything works fine on local development, 2 pages are throwing the ChunkLoadError.
I have looked at other issues on SO, and checked my output path, file is really there.
Page is here : https://dev.trouveruncouvreur.ca/guide-toiture and same for https://dev.trouveruncouvreur.ca/city/d-soumission-couvreur-toiture-Brossard
Error is here :
The chunk is available if you click on the link https://dev.trouveruncouvreur.ca/js/blogs-component.js
Edit: I deleted the project from the dev server, and reinstalled everything without success. I keep having the same issue. I did install on another server I have access to, and the error is gone, pages are all served correctly. We just found out client on dev server is using Cloudflare, so once we have acces, we can delete cache and see how it goes.
In this case, Cloudflare's cache was the culprid. All vues files/chunk are now correctly served.

"_ssgManifest.js" & _buildManifest.js missing from a nextjs app hosted on Google Cloud Platform

sometimes the console shows these errors on opening the website
GET https://example.com/subpath/_next/static/9ufj5kFJf/_buildManifest.js
[HTTP/3 404 Not Found 311ms]
GET https://example.com/subpath/_next/static/9ufj5kFJf/_ssgManifest.js
[HTTP/3 404 Not Found 334ms]
Loading failed for the <script> with source “https://example.com/subpath/_next/static/9ufj5kFJf/_buildManifest.js”. 1434-247:1:1
Loading failed for the <script> with source “https://example.com/subpath/_next/static/9ufj5kFJf/_ssgManifest.js”.
the app does use ISR and that seems to be working, it does get updated, what do these files do? what could happen if they are missing?
"react": "17.0.2"
"next": "10.1.3",
"node" "15.1.2"
I had the same problem with GCP (Kubernetes engine) with pods count > 1. I resolved the issue by restarting the deployment (all pods).
On that Github issue #Prabir linked to in a comment, someone posted a way to use the generateBuildId function within the Next.js config file:
const execSync = require("child_process").execSync;
const lastCommitCommand = "git rev-parse HEAD";
module.exports = {
async generateBuildId() {
return execSync(lastCommitCommand).toString().trim();
},
};
I work with an app that uses some combination of AWS CodeBuild and Docker images, which prevents direct access to all the git commands so that snippet above didn't work. But using CODEBUILD_BUILD_ID or really any environment variable (unique to either that commit or the build itself) did. I'm not as familiar with the GCP-equivalents but this Cloud Build Docs page makes it seem like $COMMIT_SHA would be a good option to try.

getting error: Could not start Ghost Driver

I'm trying to run Ghostdriver inside my Openshift server. As i run this command:
./phantomjs --webdriver=15002
It says:
PhantomJS is launching GhostDriver...
[ERROR - 2014-08-01T04:14:21.160Z] GhostDriver - main.fail - {"message":"Could not start Ghost Driver","line":82,"sourceId":139887801789952,"sourceURL":":/ghostdriver/main.js","stack":"Error: Could not start Ghost Driver\n at :/ghostdriver/main.js:82","stackArray":[{"sourceURL":":/ghostdriver/main.js","line":82}]}
$ ./phantomjs --version
1.9.8
Please help me out, I'm getting this error from 10 Days. I searched everything and googled everything. nothing is sorted me out :( I'm much upset :(
Help surely would be appreciated!!
OpenShift doesn't allow binding the localhost address; there is a patch to allow GhostDriver to bind any specified IP (currently it always binds to localhost no matter what), but it still hasn't made it in the PhantomJS source tree and binary distributions.
In order to use PhantomJS + GhostDriver on OpenShift I recompiled it after applying the patch, you can find it here: https://paolobernardi.wordpress.com/2015/02/25/phantomjs-with-ghostdriver-on-openshift/
Check the Port Number while running the below command. Might be your port say 5555 is already in used. So change that if you get this "Could not start Ghost Driver" error
phantomjs --webdriver=5555
From the documentation it looks like you should be able to do something like this:
./phantomjs --webdriver=$OPENSHIFT_NODEJS_IP:15002
You may have to actually type in your ip address there, not sure if that env variable will populate correctly..
http://phantomjs.org/api/command-line.html
--webdriver starts in 'Remote WebDriver mode' (embedded GhostDriver): '[[:]]' (default '127.0.0.1:8910')
I have not been able to make Paolo Bernardi's patch work, I always catched a segmentation fault. So I re-compiled it on an RHEL machine, and this one worked for me: http://christophe-maillard.com/phantomjs-1.9.8.patched/phantomjs.tar.gz
PS: see Trying to run PhantomJS on OpenShift: cannot patch GhostDriver so that it can bind on the server IP address
Make sure the phantomjs process isn't already running
ps -ef | grep phantom

StatsD start error

I'm having some troubles with statsD from etsy, and seeing that i'm not really experienced with javascript I thought I should ask a question maybe somebody has encountered this error before, because sadly this time google hasn't been that helpful.
The troubles have started a couple of days ago when I decided to restart the node process that was keeping statsD up, when after the restart it just wouldn't start. It gives me the following output:
2 Jul 03:02:08 - reading config file: /opt/statsd/statsd/psrkConfig.js
2 Jul 03:02:08 - server is up
2 Jul 03:02:08 - Loading backend: ./backends/graphite
events.js:72
throw er; // Unhandled 'error' event
^
Error: bind Unknown system errno 92
at errnoException (dgram.js:440:11)
at dgram.js:207:28
at dns.js:72:18
at process._tickCallback (node.js:415:13)
First of all I think I should have described a little my environment. I'm using gentoo as an OS, I have net-libs/nodejs-0.10.10 installed on the system(was actually 0.10.8 but I upgraded in my search for the problem resolution) and I have cloned the latest etsy/statsD repo from git. I have also tried with the npm version of statsD but got the same behaviour.
I tried following the program with strace and got to the error, but I have no idea how to procede forward. The syscall that fails from what I'm guessing is the following one:
setsockopt(11, SOL_SOCKET, 0xf /* SO_??? */, [1], 4) = -1 ENOPROTOOPT (Protocol not available) <0.000009>
but it has to be called from somewhere inside statsD (making it easier to debug), and I could not find it.
I would appreciate any kind of little help or pointers, because I'm guessing the error comes form the node.js libraries and I'm pretty clueless about them. Thank you.
similar to #user1135, had trouble with binding to UDP sockets on a recent build of debian/testing. we commented out the #ifdef sections in udp.c and recompiled to fix the problem.
I had a similar problem recently, also on Gentoo Linux. It so happened I had the 3.9 linux headers installed but was still running an older kernel. This caused SO_REUSEPORT to be defined when building node.js (specifically uv). Going back to the proper header version or doing #undef SO_REUSEPORT inside of deps/uv/src/unix/udp.c should fix it. Also upgrading to a 3.9+ kernel would do it.

Categories

Resources