Not able to deploy Angular7 app on github pages

Question

Github Repo:- UI-asset-Agm.

ProjectName:- UI-assets I am running the following commands to deploy angular app on github pages

ng build --prod --base-href "https://skatia.github.io/UI-asset-Agm"



   ngh or 
     npx ngh --dir=dist/UI-assets

But when I go to

 https://skatia.github.io/UI-asset-Agm/ or 
https://skatia.github.io/UI-assets/

it says site not found

dist/UI-assets/index.html is

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>UIAssets</title>
  <base href="https://skatia.github.io/UI-asset-Agm">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://unpkg.com/tachyons@4/css/tachyons.min.css">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

<link rel="stylesheet" href="styles.491137759dd7a3a3a7e2.css"></head>
<body>
  <app-root></app-root>
<script type="text/javascript" src="runtime.ec2944dd8b20ec099bf3.js"></script><script type="text/javascript" src="polyfills.1ef83d22ada557f4a131.js"></script><script type="text/javascript" src="main.ca0a7471bf0fe9d8f66d.js"></script></body>
</html>

Felix Lemke · Accepted Answer · 2019-01-15 15:04:38Z

2

Assuming you have got an empty git repository named ui-asset-agm for your github account named skatia, and a working Angular 6+ project (ng build --prod runs without errors) the following should work for you.

Setting up Angular

In your angular.json add (or update) the following rules to your configurations/production entry

"production": {
  ...
  "baseHref": "/"
  "deployUrl": "https://skatia.github.io/ui-asset-agm"
}

also change the outputPath in the same file to docs (it is dist by default). Build with

ng build --prod

After doing so there should be a folder called /docs with your successfully built angular application. If not, there are some issues with your Angular project.

Pushing to github

Add your github repository as remote

git remote add origin https://github.com/skatia/ui-asset-agm

and push it to github with

git push -u origin master

In github go to the repos settings and select something like "use github pages with master/docs folder". Your page will then be available under

https://skatia.github.io/ui-asset-agm

It takes some time for the site to be published, in my experience approximately one or two minute(s).

edited Jan 15, 2019 at 15:04

answered Jan 9, 2019 at 15:42

Felix Lemke

6,4863 gold badges46 silver badges69 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Sahil Kkr Over a year ago

After ng build --prod, what I need to do? Push to github? I didnt understand....., No ngh command?

Sahil Kkr Over a year ago

I made changes in angular.json . then ng build --prod then ngh but it didn't make any effect

Felix Lemke Over a year ago

If it is run git push origin master otherwise run git remote add origin https://github.com/skatia/ui-asset-agm and git push -u origin master.

Sahil Kkr Over a year ago

I don't think. Is there any check?

Felix Lemke Over a year ago

git remote get-url origin

|

Collectives™ on Stack Overflow

Not able to deploy Angular7 app on github pages

1 Answer 1

8 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Related