Cannot find App when deploying create-react-app to heroku - reactjs

I am trying to deploy my react ao mars-create-react-app buildpack following heroku's own guide for this Link to relevant Heroku documentation
However, during running of git push heroku master, the script fails during react-scripts build with the following error message:
Module not found: Error: Can't resolve './App' in '/tmp/build_8a984beabf2037d5fc71f69dc6558433/src'
Any ideas as to what could cause this?
Locally, the yarn npm build-js command runs without a problem.
The problem seems to be with the import of App.js into index.js, because even tho they are located in the same folder, index.js cannot resolve App.js in none of the three following ways: as './App', './App.js' and 'App.js'.
I get the same error with a simple empty create-react-app project so it is not specific to anything I have added in the code.

Related

create-react-app error while using yarn 3

I'm using yarn 3.2.0(latest) and node 17.6.0(latest)
As instructed in CRA documentation I ran yarn create react-app myapp. It completed installation and was able to start the app using yarn start. However after making changes to the App , I always get the following error
ERROR
Failed to load config "react-app" to extend from.
Referenced from: D:\myapp\package.json
If I install any packages, I get module not found error like below
ERROR in ./src/App.js 6:0-39
Module not found: Error: Can't resolve 'styled-components' in 'D:\myapp\src'
Anyone know what's going on?
I had a similar issue. And found that the reason why this was happening to me was due to my Antivirus. Try disabling your antivirus on windows if you have one and re-create your project and if that fixes your issue.

React: Module not found: Can't resolve 'react-firebase'hooks' in 'C:\Users\<Name>\Web Dev\Firechat\firechat\src'

So I am attempting to make a web app with React, Firebase, and the react-firebase-hooks module and I can't even get my code to compile. I have uninstalled react-firebase-hooks at least 3 times now and re-installed it just the same. I even installed it globally.
My output from npm list is:
Firebase resolves fine and there are no issues, so it can't be that something isn't installed. In my code, I am using:
import {useAuthState} from 'react-firebase-hooks';
import {useCollectionData} from 'react-firebase-hooks/firestore';
To import useAuthState and useCollectionData from react-firebase-hooks.
Has anyone else had any issues with this? Is this some sort of compatibility issue that I'm not noticing? I also created a totally separate project running
npx create-react-app test
and then
cd test
followed by
npm install --save react-firebase-hooks
, imported the same 2 components from that module, ran my code with
npm start
and got the same error as I did in my actual app.
I also used
rm -rf node_modules
and then ran
npm install
to no avail.
I am fairly new to the web dev world as well as React and Firebase so please forgive me if I'm overlooking something here.
The useAuthState comes from "react-firebase-hooks/auth" modeule, that's why it's not working

Module not found : Can't resolve './App' in 'C:\Users\user\Desktop\react-challenge\sample\src'

I am learning react from a playlist and had created a basic app with create-react-app it was up and running without any issues initially. After I deleted some files in 'src' and 'public' ,the terminal is showing this error:
./src/index.js
Module not found: Can't resolve './App' in 'C:\Users\user\Desktop\react-challenge\sample\src'
I deleted everything except for 'index.html' in public and 'index.js' in src file. I have attached the folder structure and index.js below.
EDIT: it was an issue regarding the files getting saved and reloading it is solved now.
It's fine to delete App.js if you're not using it, and it looks like you're not.
You probably just need to restart your development server.
Stop it with Ctrl + C
Start it again with npm start or yarn start
power off your code editor and start again the code editor then run npm start in the terminal

npm run deploy failure when deploying React app to Github

Problem:
I am still very new to React and am trying to push my React app onto Github, but I keep running into an error when I deploy it on my console.
Set Up:
I am using Atom on a Windows 10 computer. I created my React app by using the commands, npx create-react-app jordon. I then followed the steps in this youtube tutorial. This is what my package.json looks like after following the tutorial:
I then went through the steps to initialize a github repository. However, after running npm run deploy, I come across an error:
I have tried to rerun the steps in the tutorial time after time, but either receive the same error, or an error that is resolved by uninstalling gh-pages from the folder but leads to the same error. At this point, I have not found any resources that would help me, since most people seem to have successfully ran the npm run deploy command. Any help would be much appreciated!

React app 'Failed to compile' because './node_modules/jss-default-unit/lib/index.js' not found

I've just updated some Node modules in a React react project, but now when I go to localhost:3000 I get a Failed to compile error because ./node_modules/jss-default-unit/lib/index.js was not found:
The packages I've upgraded are Material UI and react-scripts, as seen from a git diff of package.json:
How can I resolve this issue?
(This issue, https://github.com/cssinjs/react-jss/issues/146, describes a similar issue caused by Babel running on node_modules, but I wasn't able to find a webpack.config.js in node_modules/babel-loader to modify).
I resolved this by running npm install jss-default-unit and restarting the server with npm start.

Resources