11

I'm trying to deploy a Angular 4 app to Firebase using GitLab CI but it's failing.

Here is my CI configuration:

image: node:latest

cache:
  paths:
    - node_modules/

stages:
  - setup
  - build
  - deploy

setup:
  stage: setup
  script:
    - npm install
  only:
    - master

build:
  stage: build
  script:
    - npm install -g @angular/cli
    - ng build -prod
  only:
    - master

deploy:
  stage: deploy
  script:
    - npm install -g @angular/cli
    - npm install -g firebase-tools
    - ng build -prod
    - firebase use --token $FIREBASE_DEPLOY_KEY production
    - firebase deploy -m "Pipeline $CI_PIPELINE_ID, build $CI_BUILD_ID" --non-interactive --token $FIREBASE_DEPLOY_KEY
  only:
    - master

It's failing at the build stage, i think it's cause the @angular/cli install command.

Also, there is the log of the build stage: http://pasted.co/8d06985e

Improve this question
1
  • Really what do u want? and what kind of project? Why don't u use dockers in your CI/CD? Commented Sep 17, 2017 at 23:17

4 Answers 4

Reset to default
14

For some reason, globally installed packages are not added to the PATH and not available. What I'm doing is using relative paths (with recent versions of np executables like ng are installed in the node_modules/.bin subfolder)

build:
  stage: build
  script:
    - npm install @angular/cli
    - ./node_modules/.bin/ng build -prod
Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

2

You should configure the build script in package.json:

"scripts": {
  "ng": "ng",
  "start": "ng serve",
  "build": "ng build --prod",
},

Since you are running npm install already in your setup stage, you should not run npm install -g @angular/cli in your build stage. Instead, simply invoke the build script:

build:
  stage: build
  script:
    - npm run build

This way you can avoid creating build on every stage and use your local Angular CLI which you've already downloaded in setup stage.

Alternatively, if you dont want to add a build script in package.json, you can still leverage the local Angular CLI directly in the build stage as follows:

build:
  stage: build
  script:
    - npm run ng -- build --prod

This is admittedly a bit ugly but it does help avoid reinstall of Angular CLI globally.

A less ugly version of above script (using npx, applicable only for node > 5.2) is as follows:

build:
  stage: build
  script:
    - npx ng build --prod
Improve this answer

Comments

0

You should not hardcode the path use $(npm bin) instead... it will produce the path to the closes bin folder.

Improve this answer

Comments

-1

if u use angular project, below code is enough in your script

script:
- apk add --no-cache git
- npm install
- npm install -g bower
- bower install --allow-root
- npm run-script build

npm install already install all libraries in your package.json

Improve this answer

1 Comment

This is an incomplete answer and also requires Bower, which is not a given with Angular cli.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.