-1

screenshot here, please click here I am getting an error that says "Refused to apply style from..." because the file type is not supported. Below is the HTML file located in the public folder of my React project:

<!DOCTYPE html>
<html lang="en">
   <head>
      <meta charset="utf-8" />
      <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
      <meta name="viewport" content="width=device-width, initial-scale=1" />
      <meta name="theme-color" content="#000000" />
      <meta
         name="description"
         content="Web site created using create-react-app"
      />
      <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
      <!--
         manifest.json provides metadata used when your web app is installed on a
         user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
         -->
      <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
      <!--
         Notice the use of %PUBLIC_URL% in the tags above.
         It will be replaced with the URL of the `public` folder during the build.
         Only files inside the `public` folder can be referenced from the HTML.

         Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
         work correctly both with client-side routing and a non-root public URL.
         Learn how to configure a non-root public URL by running `npm run build`.
         -->
      <title>React App</title>
   </head>
   <body>
      <noscript>You need to enable JavaScript to run this app.</noscript>
      <div id="root"></div>
      <!--
         This HTML file is a template.
         If you open it directly in the browser, you will see an empty page.

         You can add webfonts, meta tags, or analytics to this file.
         The build step will place the bundled scripts into the <body> tag.

         To begin the development, run `npm start` or `yarn start`.
         To create a production bundle, use `npm run build` or `yarn build`.
         -->
   </body>
</html>

I would greatly appreciate any help or guidance on how to fix this error. Thank you.

the following is the errors I am getting in the browser

Refused to execute script from 'https://frontendapp-vo2y.onrender.com/1kamara/great_brain.git/static/js/main.d9d6534a.js' because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled.

The full project code is available here

luigig44
  • 417
  • 1
  • 3
  • 10
Abubakar M Kamara
  • 11
  • 1
  • 3
    Always share the full error. Also, this is likely a duplicate of [Resource blocked due to MIME type mismatch (X-Content-Type-Options: nosniff)](https://stackoverflow.com/q/40728554/215552) – Heretic Monkey Jun 16 '23 at 14:35
  • 1
    Most-likely your `PUBLIC_URL` is wrong – Konrad Jun 16 '23 at 15:57
  • 1
    Its probably more suitable for Webmasters site – Rohit Gupta Jun 23 '23 at 02:58
  • 2
    If you look at the error it says `its MIME type ('text/plain') is not executable` . Open the url on it's own, you will notice that it just returns "Not Found". Fix the path and you are set. – Ibu Jun 23 '23 at 20:27

1 Answers1

1

@Konrad's comment is correct. Specifically, your problem is you've misconfigured the homepage in package.json, which is used as PUBLIC_URL (See create-react-app docs).

Deleting the following line from package.json should be enough:

   "homepage": "https://github.com/1kamara/great_brain.git",
luigig44
  • 417
  • 1
  • 3
  • 10
  • can you clarify how can I configure URL properly in packet.json? If delete "homepage": "https://github.com/1kamara/great_brain.git" where am I going to place it? – Abubakar M Kamara Jun 27 '23 at 12:47
  • { "name": "great_brain", "homepage": "https://github.com/1kamara/great_brain.git", "version": "0.1.0", "private": true, "dependencies": { "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", "clarifai": "^2.9.1", "particles-bg": "^2.5.5", "react": "^18.2.0", "react-dom": "^18.2.0", "react-router-dom": "^6.12.0", "react-scripts": "5.0.1", "react-tilt": "^1.0.2", "tachyons": "^4.12.0", "web-vitals": "^2.1.4" }, that is my packet.json – Abubakar M Kamara Jun 27 '23 at 12:54
  • 1
    Delete the line. Do not set homepage. If you must set it for some reason, it should be set to your **deployment** URL, not your source code. If you are intent on keeping the line as is, look into ways of setting the `PUBLIC_URL` environment variable to override it. – luigig44 Jun 28 '23 at 17:39