Angular
How to build and deploy Angular app on GitHub ?
Steps to deploy Angular app on GitHub :
Step 1:
To deploy Angular application first create a repository on GitHub. To do that navigate to https://github.com/ and click on New Repository.
After the repository is created, use git command to add this repository as remote to the local project. For that run command as below :
git remote add origin https://github.com/USERNAME/PROJECT_NAME.git
Do not forget to change username and project name. Once the remote repository is added, you can verify that using the command
git remote -v
As output, you should get repository listed as below:
Step 2:
To deploy the Angular application to GitHub, you need to first install the angular-cli-ghpages globally:
npm install -g angular-cli-ghpages
After installing that ghpages, use Angular CLI to build the project. For that run command as shown below:
ng build --prod --base-href <project-name>
Below is the example
ng build --prod --base-href https://github.com/ramnaik-g/AmbienceElegancer
Make sure that you are using your GitHub username and repository name. After successful execution of the command, you should get bundle.js created as shown in the image below:
Steps 3:
Run the command below command to publish the application as shown in the image below:
ngh -no-silent
Step 4: Verification
After successful publish navigate to https://<username>.github.io/<reponame>/ to navigate to the application. This is all you need to do to deploy the Angular application to GitHub.
Note:
Step 1:
To deploy Angular application first create a repository on GitHub. To do that navigate to https://github.com/ and click on New Repository.
After the repository is created, use git command to add this repository as remote to the local project. For that run command as below :
git remote add origin https://github.com/USERNAME/PROJECT_NAME.git
Do not forget to change username and project name. Once the remote repository is added, you can verify that using the command
git remote -v
As output, you should get repository listed as below:
Step 2:
To deploy the Angular application to GitHub, you need to first install the angular-cli-ghpages globally:
npm install -g angular-cli-ghpages
After installing that ghpages, use Angular CLI to build the project. For that run command as shown below:
ng build --prod --base-href <project-name>
Below is the example
ng build --prod --base-href https://github.com/ramnaik-g/AmbienceElegancer
Make sure that you are using your GitHub username and repository name. After successful execution of the command, you should get bundle.js created as shown in the image below:
Steps 3:
Run the command below command to publish the application as shown in the image below:
ngh -no-silent
Step 4: Verification
After successful publish navigate to https://<username>.github.io/<reponame>/ to navigate to the application. This is all you need to do to deploy the Angular application to GitHub.
Note:
I have faced below error while building :
Could not find plugin "proposal-numeric-separator". Ensure there is an entry
Solution:
Try to install "@babel/compat-data": "~7.8.0" to devDependencies by adding them to package.json and rum npm update.
If that does not work then delete node-modules folder and try installing it after adding the above 2 dependencies in package.json
Post a Comment
0 Comments