ホームページ > 記事 > ウェブフロントエンド > Angular+Jenkins を使用してビルド バージョンを表示する方法について話しましょう
この記事では、angular の学習を継続し、Jenkins と Angular を組み合わせて使用してビルドされたバージョンを表示する方法を学習します。
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 を使用してノード プロジェクトの自動構築を実装する 記事と併せてお読みください。現時点では、次のように記事 Jenkinsfile の内容に注目してください。
pipeline { agent any tools { nodejs "nodejs" } stages { stage('Dependency') { steps { sh 'npm install' } } # 我们在此添加过一个 stage,见下面? stage('Build') { steps { sh 'npm run clean' sh 'npm run build' } } } }
build_info を完成させるために stage
を追加しました。 jsonファイルの書き込み。
stage('Version') { steps { script { def amap = 'build_number': BUILD_NUMBER, # 构建号 'job_name': JOB_NAME # 任务名称 ] # 写入文件 writeJSON file: WORKSPACE+'build_info.json', json: amap # WORKSPACE 根目录 } } }はい、そのアイデアは問題ありません...そうですか?2 番目のステップに進みましょう。
build_info.json の内容を読み取り、## をインターセプトします。 #version.js
運用環境の内容: <pre class="brush:js;toolbar:false;">// 引入生成的 build_info.json 文件
let buildInfo = require(&#39;./build_info.json&#39;);
if(config.env === &#39;production&#39;) {
// 获取构建的版本号,否则获取默认的版本
versionObj.version = buildInfo.build_number || config.version
}</pre>
上記のファイルを完成させたら、関連する環境に公開できます。すべてがうまくいけば、関連するバージョン番号がページ。
この記事は
angular とはあまり関係がありません。jenkins
と連携するためにのみ使用されます。次の記事では、spa
開発での Angular
の使用について説明しますので、乞うご期待ください。
プログラミングビデオ著者: Jimmy
プログラミング関連の知識の詳細については、こちらをご覧ください。をご覧ください:
以上がAngular+Jenkins を使用してビルド バージョンを表示する方法について話しましょうの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。