Github Page deployment issue - javascript

I recently completed my first project that integrates html, css, and javascript. When I deployed the website to github pages, the site generated looks like the html file is not communicating with the css and js files.
When I run the index.html file on my local machine, it works just fine on the mozilla and safari browsers. Can anyone help me understand why this is happening?
Here is a link to the github repository My Github Repository
Here is what the site is supposed to look like
Thank you

Looking at your repository the files are in the same directory as the index.html, so:
instead of <script src="./javaScript/script.js"></script>
import like this:<script src="/script.js"></script>
Doing /script.js is the same as
https://xavier-julian-rodriguez.github.io/OrlandoDateGenerator/script.js
To check if you are importing correctly try to access the file from the url: https://xavier-julian-rodriguez.github.io/OrlandoDateGenerator/script.js

Related

Javascript works on localhost, but it stops on deploy github pages or vercel

Can someone tell me why the javascript works on localhost, but when using github Pages or vercel, the javascript stops?
code on github:https://github.com/Marincor/Bx-Bank
Deploy githubpage: https://marincor.github.io/Bx-Bank/
Deploy on Vercel: https://bx-bank.vercel.app/
when I go to the dev tools source of the pages index.html and cadastro.html they don't have the JS folder that I have linked.
print of devTools chrome sourcers tab
print of github JS folder
print of the script src inside the html file
i don't know what to do, any tips?
for some reason, the home.html works the javascript file, just index.html and cadastro.html doesn't.
Format the path to your script file with a preceding ./ like you do with your css links:
<script type="module" src="./Assets/JS/Index.js"></script>
Edit: and be aware of casing:
<script type="module" src="./Assets/JS/index.js"></script>

How to build a svelte project from source?

I found an useful code on Github https://github.com/ShizukuIchi/pdf-editor, but I have only written JS and HTML before. It contains a yarn.rock and some .svelte files, so I assume this might be a svelte project. I have tried to run the index.html in the browser directly but it doesn't work. What do I need to build this code?

Why my React app is not loading correctly (broken) in localhost?

I had my react project working correctly in localhost. Then, I decided to deploy it to github pages and it worked perfectly on the server too. Now, I'm trying to work on it again on localhost but it is not showing correctly. For some reason, photos are not loading and some css is not working correctly and after compile it in PowerShell says this:
Compiled successfully!
You can now view myportfolio in the browser.
Local: http://localhost:3000/myportfolio
On Your Network: http://192.168.56.1:3000/myportfolio
Note that the development build is not optimized.
To create a production build, use npm run build.
So if I go to my GitHub pages it is loading correctly but not in localhost (running npm start).
Any suggestion? Thank you in advance and let me know if you need more clarification
I did clone your repositories and found these problems:
You have been directly imported many third-party js given their relative path in the index.html. That doesn't work. You should append %PUBLIC_URL% before them. For e.g.
<script src="%PUBLIC_URL%/js/jquery.flexslider.js"></script> and similary for other script files.
But even this is not the best that you can do. You must not try to use jquery or third party js in a React App. Also, make it a part to install the related JS though npm and make them a part of the package.
You'll have to use <img src={require('/public/images/background.png')}... (Btw, the image name on your gh-pages is different. It's logo.png there)if you want the webpack to compile and make it a part of your project. Also, the path must reside within src and not public folder.
Other errors are are related to keys. Whenever you're mapping and iterating through a list in react you must specify a unique key.

Issues with webpack.config

I created a small project using scrimba.com. It works fine on scrimba's browser, but when I downloaded it and tried to open it on Chrome it doesn't work (or Firefox or GitHub Pages).
The error goes as follows: .../script.pack.js net::ERR_FILE_NOT_FOUND, so I figured it has to do with my script src="script.pack.js", but can't make it work nor did I found a solution. I am new to coding and would appreciate a hand. Below are screenshots of the following files:
index.html
package.json
webpack.conf.js

Problems with adding multiple html files on Mosync

i'm new to Mosync and i'm trying to create an HTML5/Javascript project. The IDE generates a main.cpp file and an index.html file.
The main.cpp file contains a reference for the index.html file; i've already tried creating a new html file inside the same folder where the generated index.html file is and changed the reference in the main.cpp file to call the file that i've just created but it gives me an error that says the file cannot be found.
I've even tried removing all the code in the generate index.html file and running it and the results still shows all the deleted code from the index.html file.
My question would be how do i add multiple html files when creating a MoSync project?
It should work to do what you are doing, this could be a bug. Can you provide some details about which version of MoSync you are using, and which platform?
You should be able to have any html file in the folder LocalFiles in a MoSync project, and then just pass the file name to showPage in main.cpp, just as you are doing.
Perhaps the project is not rebuild properly? Try to right-click on the project in Eclipse, then select Rebuild. Are you on iOS or Android? How do you transfer the app to the device?
As Mikael mentioned also, I think it is an IDE bug, I tried refreshing/rebuilding the project and it worked fine. Sometimes eclipse does not detect file changes that come from other editors so it ignores them.

Categories

Resources