React Github Pages Deploy ERR_ABORTED 404 (Not Found)

Question

I'm trying to deploy my create-react-app here But I'm getting these error. static/css/1.e03ed13c.chunk.css net::ERR_ABORTED 404 (Not Found). I have no any chunk.css file. What is a problem? Can you help me?

My package.json

{
  "homepage": "http://ebrugulec.com/image-text-detection",
  "name": "image-text-detection",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "axios": "^0.18.0",
    "filepond": "^3.5.0",
    "filepond-plugin-image-preview": "^3.1.4",
    "react": "^16.6.3",
    "react-autosize-textarea": "^5.0.1",
    "react-dom": "^16.6.3",
    "react-dropzone": "^7.0.1",
    "react-filepond": "^5.0.0",
    "react-scripts": "2.1.1",
    "superagent": "^4.0.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "predeploy": "npm run build",
    "deploy": "gh-pages -d build"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],
  "devDependencies": {
    "gh-pages": "^2.0.1"
  }
}

I guess, one thing you might be missing is correcting your homepage in package.json. Also, chunk.css is generated. — sudo bangbang
– sudo bangbang, Commented Dec 21, 2018 at 12:13
I edited my question and I added a package.json file. @sudobangbang — Ebru Gulec
– Ebru Gulec, Commented Dec 22, 2018 at 15:12

Arghya Sadhu · Accepted Answer · 2020-09-01 13:11:58Z

8

I was able to resolve the problem by adding Adding "homepage": "." to package.json.

edited Sep 1, 2020 at 13:11

Arghya Sadhu

45.2k10 gold badges100 silver badges122 bronze badges

answered Sep 1, 2020 at 12:42

jake

1733 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sean Hwang · Accepted Answer · 2019-05-19 04:45:33Z

7

I solved this issue by adding

"homepage" : "https://myblog-url",

in 'package.json' file in my react-app project directory

xxx.chunk.js and xxx.chunk.css file is in 'build/static/' directory

and when I went to network tab of developer tools of chrome and saw the exact error messages,

I was able to find url my browser was going to access, and in my case, the url of my blog was different from what I meant to be.

edited May 19, 2019 at 4:45

answered May 19, 2019 at 4:28

Sean Hwang

4617 silver badges22 bronze badges

1 Comment

Klyner Over a year ago

Adding "homepage": "." to package.json worked for me.

KushalSeth · Accepted Answer · 2021-05-03 22:41:35Z

If adding . to "homepage": "." in package.json not working then this answer will help you.

I have checked my developers console and my first indication was, where is this build folder which is throwing error.

Step 1: (optional, if your build folder is already committed, then skip this step) First commit your build folder, if that is not committed.

To commit build folder:

First remove the reference of build folder from your .gitignore
Then add your folder and commit

Sample: my folder path of build folder is covidresources -> build. (note: git add . is just to include other files as well, if any)

git add covidresources/build
git add . 
git commit -m "added build files"
git push

Just verify if your build files are now committed.

Step 2: Now, we will pick one file and compare the path of the file in repository and the path of the file in developers console (the file which was throwing error).

Initially I have "homepage": "." in package.json.
Pick any error from console, like in my case, I have picked the path of this file: 2.6770f89d.chunk.js from console

https://kushalseth.github.io/kushalseth/mycovid/blob/main/covidresources/static/js/2.6770f89d.chunk.js

Search the same file path in repository.
Now compare the two paths:

SOLUTION:

Replace, "homepage": "." with the path, something like this: (the screenshot of actual and file path will help to make this url. Just removed the name of user, and added repository name after github.com)

"homepage": "https://github.com/mycovid/"

Deploy and commit your files. Our main aim is to commit build/asset-manifest.json file.

npm run deploy
npm add .
npm commit -m "committing manifest"
npm push

Your manifest file should look like this: (repoitoryname/static).

It is important that your server manifest file is updated and It's also important to verify the path in manifest. We donot change anything manually in manifest. it gets updated automatically by npn run deploy and package should have correct homepage.

Refresh your page, and in networks of developers console, the success path will come like this:

https://kushalseth.github.io/mycovid/static/js/2.6770f89d.chunk.js

Muthu · Accepted Answer · 2022-05-13 13:22:42Z

0

Adding the below property in the package.json will solve this problem.

"homepage": "."

answered May 13, 2022 at 13:22

Muthu

952 silver badges9 bronze badges

Collectives™ on Stack Overflow

React Github Pages Deploy ERR_ABORTED 404 (Not Found)

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related