1

I have finally incorrectly published my React App onto GitHub Pages. I believe that the issue is that my React App is trying to pull files from my local computer instead of my GitHub (which I don't want anyways). How would I change this?

My website has the error:

Not allowed to load local resource: file:///C:/Users/numak/Desktop/MyWebsite/dist/bundle.js

This first issue (of probably many) is in my index.html file which sources my bundle.js file like this:

<!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8" />
            <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
            <title>React Starter</title>
        </head>
        <body>
            <div id="root"></div>
            <noscript>
                You need to enable JavaScript to run this app.
            </noscript>
            <!-- Here is the problem apparently -->
            <script src="../dist/bundle.js"></script>
        </body>
  </html>

I'm not sure if this is actually an issue with the way I sourced it. It could also have to do with how I setup my website in my package.json or webpack.config.js files.

Here is a link to my GitHub branch that hosts the files for the GitHub Pages website:

https://github.com/NumaKarolinski/PersonalWebsite/tree/websiteVersion1

Here is a link to my GitHub Pages branch:

https://github.com/NumaKarolinski/PersonalWebsite/tree/gh-pages

Here is a link to my GitHub Pages website:

https://numakarolinski.github.io/PersonalWebsite/

Thanks for any help!

FlamePrinz
  • 490
  • 1
  • 5
  • 20
  • 1
    Where will your `bundle.js` file be located on the server? Will it be in a `dist` folder? It might just work if you write `src="/dist/bundle.js"` instead. – Tholle Jul 18 '18 at 23:22
  • 1
    You could try `https://raw.githubusercontent.com/NumaKarolinski/PersonalWebsite/websiteVersion1/dist/bundle.js` instead of `../dist/bundle.js` but i'm not sure if it works. – MaddEye Jul 19 '18 at 08:19

1 Answers1

0

The comment by MaddEye helped me discover my final solution.

The comment was slightly wrong because https://raw.githubusercontent.com/NumaKarolinski/PersonalWebsite/websiteVersion1/dist/bundle.js has a MIME type of text/plain, but a MIME type of text/javascript is required.

I found that you can replace raw.githubusercontent by cdn.rawgit with a final solution of: https://cdn.rawgit.com/NumaKarolinski/PersonalWebsite/websiteVersion1/dist/bundle.js

I found this solution here: Link and execute external JavaScript file hosted on GitHub

FlamePrinz
  • 490
  • 1
  • 5
  • 20