Deploy my angular website on github pages without error but not working

Question

I did as instructed in alligator .

1. I first did: npm install -g angular-cli-ghpages

C:\Users\NEGU93\AppData\Roaming\npm\angular-cli-ghpages -> C:\Users\NEGU93\AppData\Roaming\npm\node_modules\angular-cli-ghpages\angular-cli-ghpages
C:\Users\NEGU93\AppData\Roaming\npm\ngh -> C:\Users\NEGU93\AppData\Roaming\npm\node_modules\angular-cli-ghpages\angular-cli-ghpages
npm WARN angular-cli-ghpages@0.6.2 requires a peer of @angular-devkit/architect@>=0.800.0 but none is installed. You must install peer dependencies yourself.
npm WARN angular-cli-ghpages@0.6.2 requires a peer of @angular-devkit/core@>=8.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN angular-cli-ghpages@0.6.2 requires a peer of @angular-devkit/schematics@>=8.0.0 but none is installed. You must install peer dependencies yourself.

 2. angular-cli-ghpages@0.6.2
added 43 packages from 16 contributors in 4.064s


   ╭────────────────────────────────────────────────────────────────╮
   │                                                                │
   │      New minor version of npm available! 6.13.4 -> 6.14.5      │
   │   Changelog: https://github.com/npm/cli/releases/tag/v6.14.5   │
   │               Run npm install -g npm to update!                │
   │                                                                │
   ╰────────────────────────────────────────────────────────────────╯

2. Then I runned: ng build --prod --base-href "jagustinbarrachina.github.io" (My github repository I created is https://github.com/NEGU93/jagustinbarrachina.github.io ).

Generating ES5 bundles for differential loading...
ES5 bundle generation complete.

chunk {0} runtime-es2015.1eba213af0b233498d9d.js (runtime) 1.45 kB [entry] [rendered]
chunk {0} runtime-es5.1eba213af0b233498d9d.js (runtime) 1.45 kB [entry] [rendered]
chunk {2} polyfills-es2015.690002c25ea8557bb4b0.js (polyfills) 36.1 kB [initial] [rendered]
chunk {3} polyfills-es5.9e286f6d9247438cbb02.js (polyfills-es5) 129 kB [initial] [rendered]
chunk {1} main-es2015.f6ff8052967ffdaf4a5b.js (main) 506 kB [initial] [rendered]
chunk {1} main-es5.f6ff8052967ffdaf4a5b.js (main) 581 kB [initial] [rendered]
chunk {4} styles.c29ceec637ed14ee7304.css (styles) 62.1 kB [initial] [rendered]
Date: 2020-05-20T08:13:25.911Z - Hash: 69b194328f29a17de042 - Time: 136730ms

WARNING in Exceeded maximum budget for W:/HardDiskDrive/Documentos/GitHub/Web-Development/my-website/src/app/timeline/timeline.component.css. Budget 6 kB was not met by 1.15
kB with a total of 7.15 kB.

3. Finally, ngh returns:

index.html could not be copied to 404.html. This does not look like an angular-cli project?!
(Hint: are you sure that you have setup the directory correctly?)
Diagnostic info: ENOENT: no such file or directory, stat 'W:\HardDiskDrive\Documentos\GitHub\Web-Development\my-website\dist\index.html'
👨‍🚀 Uploading via git, please wait...
🚀 Successfully published via angular-cli-ghpages! Have a nice day!

Yet when I try to access " http://jagustinbarrachina.github.io/ " I see nothing. Not only that but my repository on github is still empty.

I don't know what to do. I am troubled by the index.html and 404.html error but if I see nothing in my github repository I believe the error should be before that. When I add the path.

---

Note: I should say my code is actually in another git repository I used to do a version control before. I did nothing about that but I am afraid they might interfere with each other.

---

I solved the message of index.html by doing ngh --dir dist/my-website as I foundhere . Still not working.

---

I am now using the base repository ( https://github.com/NEGU93/agustinbarrachina.github.io ) I used before. I just renamed it (I heard I should use .github.io so I renamed it for it. I repeated all the steps but still nothing. I have no errors but still nothing.

---

I connect to my website as: https://github.com/NEGU93/agustinbarrachina.github.io . When I click f12 to see the console log I get:

GET https://agustinbarrachina.github.io/my-website/styles.083be7aca1b1a022cb0d.css net::ERR_ABORTED 404
negu93.github.io/:1 Access to script at 'https://agustinbarrachina.github.io/my-website/runtime-es2015.1eba213af0b233498d9d.js' from origin 'https://negu93.github.io' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
negu93.github.io/:20 GET https://agustinbarrachina.github.io/my-website/runtime-es2015.1eba213af0b233498d9d.js net::ERR_FAILED
Access to script at 'https://agustinbarrachina.github.io/my-website/polyfills-es2015.690002c25ea8557bb4b0.js' from origin 'https://negu93.github.io' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
negu93.github.io/:20 GET https://agustinbarrachina.github.io/my-website/polyfills-es2015.690002c25ea8557bb4b0.js net::ERR_FAILED
negu93.github.io/:1 Access to script at 'https://agustinbarrachina.github.io/my-website/main-es2015.8001cdba897b3e8b2c89.js' from origin 'https://negu93.github.io' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
negu93.github.io/:20 GET https://agustinbarrachina.github.io/my-website/main-es2015.8001cdba897b3e8b2c89.js net::ERR_FAILED

Answer 1

Ok, I tried so many things and apparently it worked.

I saw here that I needed to add the dist folder. So I removed it from the gitignore.

It also said I should not keep the source code. So I actually created a new repository called gh-pages , I follows method 2 in this medium .

I had to go to setting of the repository and select to use the gh-pages branch. Now everything looks fine! https://negu93.github.io/agustinbarrachina/home