網站搜尋

javascript - 建構版本的 react 應用程式給出了錯誤的 CSS 和 JS 文件連結

我一直在開發一個名為 Simple-portfolio 的簡單 React 專案，
Github 倉庫：https://github.com/Devang47/simple-portfolio 線上網站網址：https://simple-portfolio.pages.dev/

這個專案在開發伺服器上運行正常，但在構建應用後，在 index.html 中，其他文件的連結出現錯誤。例如：

// Wrong:
<link rel="icon" type="image/png" sizes="16x16" href="./simple-portfolio/favicon-16x16.png"/>

expected:
<link rel="icon" type="image/png" sizes="16x16" href="./favicon-16x16.png"/>

生產版本的控制台錯誤：

The script from “https://simple-portfolio.pages.dev/simple-portfolio/static/js/3.f84cd7e8.chunk.js” was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type.

The script from “https://simple-portfolio.pages.dev/simple-portfolio/static/js/main.2f259d87.chunk.js” was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type.

The stylesheet https://simple-portfolio.pages.dev/simple-portfolio/static/css/main.f6d0acc0.chunk.css was not loaded because its MIME type, “text/html”, is not “text/css”. 

Uncaught SyntaxError: expected expression, got '<'

Uncaught SyntaxError: expected expression, got '<'

到目前為止我嘗試過的：

  • 刪除 node_modules
  • 刪除鎖定檔案
  • 在 Stack Overflow 上完整搜尋類似的問題
  • 在另一個分支上嘗試

答案＃1

您的應用程式已部署到 https://simple-portfolio.pages.dev/，這是網域的根目錄，但 homepage 設定為 http://Devang47.github.io/simple-portfolio/，其路徑不同。

要解決此問題，請從 package.json 中刪除 homepage，重建您的應用程式，然後重新部署到 Cloudflare Pages。