No static page loads in gitlab pages

  angular, continuous-integration, gitlab, gitlab-ci, yaml

I created a project in Angular in Gitlab page https://group-gitlab2021.gitlab.io/proyect-devops/ but when loading the page, it doesn’t throw anything at me.
Project link https://gitlab.com/group-gitlab2021/proyect-devops/, I have not yet made the merge request so I am still in the implementation phase of the .gitlab-gi.yml
The artifacts that it exports is well, I run them on my machine and if it works, then what could be failing?

I share my modifications of

.gitlab-ci.yml

image: node:12.18.4
stages:
  - install
  - test
  - build
  - deploy

install-dependencies:
  stage: install
  script:
    - npm install
  artifacts:
    expire_in: 1hr
    paths:
      - node_modules/
  cache:
    paths:
      - node_modules/

test-apps:
  stage: test
  variables:
    CHROME_BIN: google-chrome
  dependencies:
    - install-dependencies
  before_script:
    - apt-get update && apt-get install -y apt-transport-https
    - echo 'deb http://dl.google.com/linux/chrome/deb/ stable main' > /etc/apt/sources.list.d/chrome.list
    - wget -q -O - https://dl-ssl.google.com/linux/linux_signing_key.pub | apt-key add -
    - set -x && apt-get update && apt-get install -y xvfb google-chrome-stable
  script:
    - npm run test:ci


build-app:
  stage: build
  variables:
    BUILD_CONFIGURATION: 'production'
  dependencies:
    - install-dependencies
  script:
    - npm run build
  artifacts:
    expire_in: 1hr
    paths:
      - dist/


pages:
  stage: deploy
  dependencies:
    - build-app
  script:
    - mkdir public
    - pwd
    - ls -l
    - mv ./dist/proyect-devops-angular/* ./public/
    - cd ./public/
    - ls -l

  artifacts:
    paths:
    - public
  environment:
    name: production
  only:
    - branches

As I saw the console, the place where the project is hosted and shared is correct.

the outputPath of angular.json

 "outputPath": "dist/proyect-devops-angular",

and script en package.json

  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build --configuration=$BUILD_CONFIGURATION --base-href=/proyect-devops-angular/",
    "test": "ng test",
    "test:ci": "ng test --watch=false --browsers=ChromeHeadlessNoSandbox",
    "lint": "ng lint",
    "e2e": "ng e2e"
  }

Log of console google chrome

Source: Angular Questions

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.