使用 bitbucket 管道在 Firebase 托管中部署 Angular 应用程序的问题答案

【问题标题】：Issue in deploying Angular app in firebase hosting using bitbucket pipelines使用 bitbucket 管道在 Firebase 托管中部署 Angular 应用程序的问题
【发布时间】：2020-06-09 05:05:32
【问题描述】：

我正在使用 bitbucket 管道在 Firebase 托管中部署 Angular 应用程序版本 8，但在运行管道时出现了一些错误。我对某些文件进行了一些更改，请检查以下内容： e2e: protractor.conf.js

exports.config = {
...,
  capabilities: {
    'browserName': 'chrome',
    chromeOptions: {
      args: ['--headless', '--no-sandbox']
    }
  }
...}

package.json

  "scripts": {
...,
    "build:prod": "ng build --prod",
    "deploy": "firebase deploy --token $FIREBASE_TOKEN --non-interactive"
}

karma.conf.js

module.exports = function (config) {
  config.set({
...,
    customLaunchers: {
      ChromeHeadlessCI: {
        base: 'ChromeHeadless',
        flags: ['--no-sandbox']
      }
    }
})
}

bibucket-pipelines.yml

image: node:10.16.3
pipelines:
   branches:
      master: #master branch
      - step:
         deployment: production
         caches:
         - node
         script:
         - npm install
         - npm install -g @angular/cli
         - npm install -g firebase-tools 
         - ng build --prod
         - ls -laR ./dist #recursively list directories
         - firebase deploy --token=$FIREBASE_TOKEN --project your-prod-firebase-projectname --non-interactive
      develop: # develop branch 
      - step: 
         deployment: test
         caches:
         - node
         script:
         - npm install
         - npm install -g @angular/cli
         - npm install -g firebase-tools 
         - ng build
         - ls -laR ./dist #recursively list directories
         - firebase deploy --token=$FIREBASE_TOKEN --project your-test-firebase-projectname --non-interactive

我已经在 bitbucket 管道变量中添加了 firebase 令牌，但显示错误：

    1. If 'app-header' is an Angular component, then verify that it is part of this module.
    2. If 'app-header' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("[ERROR ->]<app-header></app-header>
    <div class="container-fluid">
      <section>
...

【问题讨论】：

标签： javascript angular bitbucket bitbucket-pipelines

【解决方案1】：

您是否尝试在本地运行“ng serve --prod”？您可能会获得有关此错误的更多信息，因为它看起来不像 Bitbucket 错误，而更像是 Angular 错误。你也可以把你的 Firebase 凭证放在 Bitbucket 中，我写了一篇文章：Build a Bitbucket CI/CD with Angular and Firebase

【讨论】：