React Github页面部署ERR_ABORTED 404(未找到)

时间:2018-12-15 21:15:23

标签: reactjs http-status-code-404 github-pages create-react-app

我正在尝试部署我的create-react-app here,但出现这些错误。 static / css / 1.e03ed13c.chunk.css net :: ERR_ABORTED 404(未找到)。 我没有任何chunk.css文件。怎么了你能帮我吗?

我的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"
  }
}

3 个答案:

答案 0 :(得分:2)

我可以通过在package.json中添加use foo::mod_name;来解决该问题。

答案 1 :(得分:1)

如果在 package.json 中将 . 添加到 "homepage": "." 不起作用,那么这个答案会对您有所帮助。

我检查了我的 developers console,我的第一个迹象是,抛出错误的 build 文件夹在哪里。

enter image description here

第 1 步:(可选,如果您的构建文件夹已提交,则跳过此步骤)首先提交您的构建文件夹,如果未提交。

提交构建文件夹:

  • 首先从您的 .gitignore
  • 中删除 build 文件夹的引用
  • 然后添加您的文件夹并提交

示例:我的 build 文件夹的文件夹路径是 covidresources -> build。 (注意:git add . 只是为了包含其他文件,如果有的话)

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

只需验证您的构建文件现在是否已提交。

第 2 步: 现在,我们将选择一个文件并比较存储库中文件的路径和 developers console 中文件的路径(抛出错误的文件)。

  • 最初我在 "homepage": "." 中有 package.json
  • 从控制台选择任何错误,就像在我的情况下一样,我选择了这个文件的路径:2.6770f89d.chunk.js from console
https://kushalseth.github.io/kushalseth/mycovid/blob/main/covidresources/static/js/2.6770f89d.chunk.js
  • 在存储库中搜索相同的文件路径。 enter image description here

  • 现在比较两条路径: enter image description here

解决方案:

  • 用路径替换,"homepage": ".",类似这样:(实际和文件路径的截图将有助于制作此网址。只需删除用户名,并在github.com后添加存储库名称)< /li>
"homepage": "https://github.com/mycovid/"
  • 部署并提交您的文件。我们的主要目标是提交 build/asset-manifest.json 文件。
npm run deploy
npm add .
npm commit -m "committing manifest"
npm push

您的清单文件应如下所示:(repoitoryname/static)。

<块引用>

更新您的服务器清单文件很重要,验证清单中的路径也很重要。 我们不会手动更改清单中的任何内容。它由 npn run deploy 自动更新,package 应该具有正确的 homepage

enter image description here

刷新您的页面,在 developers console 的网络中,成功路径将如下所示:

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

enter image description here

答案 2 :(得分:0)

我通过添加

解决了这个问题


  

“主页”:“ https:// myblog-url ”,

在我的react-app项目目录中的“ package.json”文件中

xxx.chunk.js和xxx.chunk.css文件位于“ build / static /”目录中

当我进入chrome开发人员工具的“网络”标签并看到确切的错误消息时,

我能够找到我的浏览器将要访问的URL,就我而言,我的博客的URL与我的本意不同。