Angular+Jenkins を使用してビルド バージョンを表示する方法について話しましょう

Angular と Git Commit バージョン処理の組み合わせについての記事の最後に、疑問が残ります。では、問題を具体化して

、Jenkins ビルドと組み合わせてみましょう。ビルド番号などのビルド情報を取得してバックフィルできるでしょうか。ページへ? [推奨される関連チュートリアル:「Angular チュートリアル」] は

次のとおりです。

うーん、オリジナルをベースに改造してみましょう。

ファイルbuild_info.jsonルート ディレクトリに追加します。

{ }

そのとおりです。 build_info.jsonの内容は次のとおりです{}

build_info.jsonファイルは、 Jenkinsfileのビルド時に生成されます。

具体的な実装のアイデアは次のとおりです。

• ビルド プロセス中に、 Jenkinsfile実行してbuild_info.jsonファイルを生成します。

• プロジェクトをパッケージ化するときに、 build_info.json

の便宜のために

ここでの環境は運用環境のみを考慮しています

。手順は 2 つの簡単な手順であり、最も重要な点はbuild_info.jsonファイルの内容をどのように記述するかです。

Jenkinsfile関連のコンテンツに詳しくない場合は、Jenkins Pipeline と Gitlab を使用した Node プロジェクトの自動構築に関する記事を読んでください。この時点では、次のように記事Jenkinsfileの内容に注目します

。
    エージェントいずれか
    
    ツール { 
        ノードjs「ノードjs」 
    }
    
    {ステージ
        stage('依存関係') {
            {ステップ数
                sh 'npm インストール'
            }
        }
        # ここにステージを追加しました。以下を参照してください。
        stage('ビルド') { 
            {ステップ数
                sh 'npm run clean' 
                sh 'npm ビルドを実行' 
            }
        }
    }

build_info.jsonファイルの作成を完了するstageを追加しました

。

stage('バージョン') {
  {ステップ数
    スクリプト {
      デフアマップ = 
        'build_number': BUILD_NUMBER, # ビルド番号 'job_name': JOB_NAME # タスク名]
      
      # ファイルの書き込み writeJSON file: WORKSPACE+'build_info.json', json: amap # WORKSPACE ルート ディレクトリ}
  }
はい

、そのアイデアは問題ありません...

2 番目のステップに進みましょう。 build_info.jsonのコンテンツを読み取り、 version.jsの実稼働環境部分のコンテンツをインターセプトします。

// 生成された build_info.json ファイルを導入します。 let buildInfo = require ('./build_info.json');

if(config.env === '本番') { 
    // ビルドのバージョン番号を取得します。それ以外の場合は、デフォルトのバージョンを取得します。 versionObj.version = buildInfo.build_number || 

、

それを関連する環境に公開すると、ページ上に関連するバージョン番号が表示されます。

この記事はangularとはあまり関係なく、単にjenkinsと連携するために使用されます。次の記事はspa開発でのAngularの使用についてですので、楽しみにしていてください。

この記事は以下から転載されました: https://juejin.cn/post/7081642981890981895

著者: Jimmy