I have deployed my angular 2 project to my github user page via angular CLI. I tried out the steps from official angular 2 cli page. However when I try to access the github url it shows the contents of readme file. Both the user page and user-page/baseUrl does the same.
I have used routing which works in the local environment. I’m not sure if I should modify the production environment variables or baseUrl.
Link to the repository: https://github.com/nirmalks/nirmalks.github.io
To summer up, if your repository does not have an Index. html it will show the ReadMe file. Thus in order to correct it all you need to do is add an index. html or index.md file to your folder and use that as main.
To deploy an Angular application to GitHub Pages you have to first create a GitHub Pages site repository on GitHub. This repository will host your GitHub Pages site. The Angular application folder must be created inside the GitHub Pages site repository for the application to be deployed using GitHub Pages.
On GitHub, navigate to your site's repository. Under your repository name, click Settings. In the "Code and automation" section of the sidebar, click Pages. Under "Build and deployment", under "Source", select Deploy from a branch.
Your angular application is now deployed and available at your github page. You can make changes locally, test them using ng serve and then build for production using ng build --prod and push your updated code to github. The page will automatically re-build.
You should commit dist/ folder generated by ng build
in master branch of your repo. As I can see you have your angular source code commited there. Unfortunatey you cannot keep your source code in your master branch.
the complete commit command with ngh will be ng build --prod --base-href="YOUR_GITHUB_USER_NAME.github.io"
and then ngh --message="MESSAGE" --branch="master"
I have published the same in my repo you can check my website
Also, the source code repo is this
Step 1:
First install the angular-cli-ghpages globally:
$ npm install -g angular-cli-ghpages
build your project and set the correct base href location:
ng build --prod --base-href="https://user-name.github.io/repo/"
Then:
$ ngh
Step 2: In github.com --> Go to your repp --> Setting --> Choose publish with gh-pages branch ==> Save
Step 3: You need to run ng server in terminal to start your local project.
Step 4: And then come back to https://username.github.io/project/"
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With