はじめに
バックエンドプロジェクトのリリースが完了したので、この投稿ではフロントエンドプロジェクト、つまり以前のオープンソースvueプロジェクトについて話し始めます。実はパイプラインを書く考え方は似ていて、まずプロセスを整理し、プロセスをしっかり定義し、Jenkinsのパイプライン構文を使ってパイプラインを書きます。ここでのvueプロジェクトのリリースも同様です。
出版プロセス分析
- コードのプル
- 静的ファイルを生成するパッケージング
- k8s publishコマンドの実行
- nginx永続化ディレクトリの取得
- 静的ファイルを永続化ディレクトリにコピー
このプロセスは前のワンクリックスクリプトですでに実装されているので、ここでは元のシェルをパイプラインにするだけです。
エンコード開始
入学に関する注意事項
ディレクトリ構造
mldong-vue ソースのルートディレクトリ
Jenkinsfile
k8s-test.yaml
k8s-prod.yaml
パッケージ.json
ドキュメント
mldong-vue/k8s-test.yamlテスト環境 k8s リリース定義ファイル
apiVersion: v1 kind: ConfigMap metadata: name: nginx-cm namespace: mldong-admin-test data: a.conf: |- server { listen 80; server_name a.mldong.com; location / { root /usr/share/nginx/html/mldong-vue; index index.html index.htm; } error_page 504 /50x.html; location = /50x.html { root /usr/share/nginx/html; } } --- apiVersion: v1 kind: PersistentVolume metadata: name: mldong-vue-test-pv labels: alicloud-pvname: mldong-vue-test-pv spec: capacity: storage: 5Gi accessModes: - ReadWriteMany csi: driver: nasplugin.csi.alibabacloud.com volumeHandle: mldong-vue-test-pv volumeAttributes: server: "9fdd94bf87-wfq72-tanakajiakou.nas.cs.com" path: "/" vers: "3" storageClassName: nas --- apiVersion: v1 kind: PersistentVolumeClaim metadata: annotations: pv.kubernetes.io/bind-completed: 'yes' pv.kubernetes.io/bound-by-controller: 'yes' finalizers: - kubernetes.io/pvc-protection name: mldong-vue-test-pvc namespace: mldong-admin-test spec: accessModes: - ReadWriteMany resources: requests: storage: 1Gi selector: matchLabels: alicloud-pvname: mldong-vue-test-pv storageClassName: nas volumeMode: Filesystem volumeName: mldong-vue-test-pv --- apiVersion: apps/v1 kind: Deployment metadata: name: nginx namespace: mldong-admin-test spec: selector: matchLabels: app: nginx replicas: 1 template: metadata: labels: app: nginx spec: containers: - name: nginx image: registry-vpc-tanakajiakou.cs.com/mldong/java/nginx:latest imagePullPolicy: IfNotPresent ports: - containerPort: 80 name: port protocol: TCP volumeMounts: - name: mldong-vue-test-pvc mountPath: "/usr/share/nginx/html" - name: nginx-cm mountPath: "/etc/nginx/conf.d" volumes: - name: mldong-vue-test-pvc persistentVolumeClaim: claimName: mldong-vue-test-pvc - name: nginx-cm configMap: name: nginx-cm --- apiVersion: v1 kind: Service metadata: name: nginx-nodeport namespace: mldong-admin-test spec: type: NodePort ports: - port: 80 targetPort: 80 selector: app: nginx --- apiVersion: v1 kind: Service metadata: name: nginx namespace: mldong-admin-test spec: type: ClusterIP ports: - port: 80 protocol: TCP targetPort: 80 selector: app: nginx --- apiVersion: extensions/v1beta1 kind: Ingress metadata: annotations: name: nginx-ingress namespace: mldong-admin-test spec: rules: - host: a.mldong.com http: paths: - backend: serviceName: nginx servicePort: 80 path: / --- apiVersion: extensions/v1beta1 kind: Ingress metadata: annotations: nginx.ingress.kubernetes.io/rewrite-target: /$2 name: mldong-admin-api namespace: mldong-admin-test spec: rules: - host: a.mldong.com http: paths: - backend: serviceName: mldong-admin servicePort: 8080 path: /api(/|$)(.*)mldong-vue/k8s-prod.yaml本番環境はパイプライン化されており、名前空間とバインドされたドメイン名に若干の変更が加えられています。
mldong-vue/Jenkinsfileパイプライン定義ファイル
pipeline { agent any parameters { string(name: 'project_name', defaultValue: 'mldong-vue', description: 'プロジェクト名') string(name: 'git_url', defaultValue: 'git@.com:mldong/mldong-vue.git', description: 'リポジトリのアドレス') string(name: 'registry_url', defaultValue: "https://...rg", description: 'npm ') string(name: 'remote_host', defaultValue: ".105", description: 'リモートサーバーのアドレス') string(name: 'deploy_type', defaultValue: 'deploy', description: 'パブリッシングの種類') string(name: 'branch_name', defaultValue: 'master', description: 'git ') string(name: 'profiles', defaultValue: 'test', description: ' ') string(name: 'k8sCredentialsId', defaultValue: 'ali-k8s-config', description: 'k8sクラスタ構成ID') string(name: 'k8sServerUrl', defaultValue: 'https://...:43', description: 'k8sクラスタサービスのアドレス') string(name: 'nfs_project_dir', defaultValue: '/mnt', description: 'nfs ') } stages { stage('コードをチェックする') { steps{ // コードをチェックする checkout([$class: 'GitSCM', branches: [[name: "*/${params.branch_name}"]], doGenerateSubmoduleConfigurations: false, extensions: [], submoduleCfg: [], userRemoteConfigs: [[ credentialsId: 'mldong-gitbash', url: "${params.git_url}"]]]) } } stage('静的ファイルを生成するパッケージング') { agent { docker { image 'node:14.4-alpine' args '-p ' } } steps { NY "node -v" NY "npm -v" // sassのセットアップ NY "npm config set sass_binary_site https://..//-ss/" NY "npm --registry=${params.registry_url} install --unsafe-perm" NY "npm run build:${params.profiles}" NY "tar -zcvf dist.tar.gz dist" stash name: "dist", includes: "dist.tar.gz" } } stage("kubectl deploy"){ agent { docker { image 'lwolf/helm-kubectl-docker' } } steps { withKubeConfig([credentialsId: "${params.k8sCredentialsId}", serverUrl: "${params.k8sServerUrl}"]) { script { NY "kubectl apply -f k8s-${params.profiles}.yaml" } } } } stage("scp to remote") { steps { script { withCredentials([ sshUserPrivateKey( credentialsId: 'mldong-gitbash', keyFileVariable: 'identity', passphraseVariable: '', usernameVariable: 'userName') ]) { // ローカルのdistを削除する NY "rm -rf dist" // 隠しファイルを取り出す unstash("dist") // NY "tar zxvf dist.tar.gz" // インデックスから移動する.html,最後のコピーを残す NY "mv dist/index.html ./" // カタログを初期化する NY "ssh -o StrictHostKeyChecking=no -i $identity $userName@${params.remote_host} mkdir -p ${params.nfs_project_dir}/${params.project_name}" // ファイルをコピーする NY "scp -r -i $identity dist/* $userName@${params.remote_host}:${params.nfs_project_dir}/${params.project_name}" // インデックスをコピーする.html NY "scp -r -i $identity index.html $userName@${params.remote_host}:${params.nfs_project_dir}/${params.project_name}" // インデックスを復元する.html NY "mv index.html dist/index.html" } } } } } }使い方の説明
- 新しいパイプラインタスク mldong-vue-test
- コードはscmメソッドを使って自動的に検出されます。
まとめ
jenkinsパイプラインの内容は、実際にたくさん書くことができますが、ここでは基本的に4つの連続したドアと見なされます。ここでは、一時的な、その後のニーズの最初の端に、追加することを検討してください。例えば、分散ビルドタスク、カスタム実行環境、メッセージ通知、リリースレビューなど。
プロジェクトソースコードアドレス
- バックエンド
- フロントエンド
関連記事
k8sのハンズオン-外部アクセス可能なサービスの完全リリース
k8s-docker Dockerfileとdocker-composeのハンズオン
k8sで遊ぶハンズオン - ワンクリックデプロイメントSpringBootプロジェクト
k8sをプレイするためのハンズオン - ワンクリックデプロイvueプロジェクト
``
