From 81b9756a456425a34b8994669caad6bca2f2e52e Mon Sep 17 00:00:00 2001
From: Allo <yin199909@aliyun.com>
Date: Wed, 8 May 2024 19:43:07 +0800
Subject: [PATCH] fix(ci): resume the build logic of the front end

---
 .github/workflows/dubboctl-ui-update.yaml | 20 ++++++++++--
 ui-vue3/Dockerfile                        | 37 -----------------------
 ui-vue3/README.md                         | 20 ++++++++++--
 ui-vue3/package.json                      |  2 +-
 4 files changed, 35 insertions(+), 44 deletions(-)
 delete mode 100644 ui-vue3/Dockerfile

diff --git a/.github/workflows/dubboctl-ui-update.yaml b/.github/workflows/dubboctl-ui-update.yaml
index 373a1e89a..f01cf1b0b 100644
--- a/.github/workflows/dubboctl-ui-update.yaml
+++ b/.github/workflows/dubboctl-ui-update.yaml
@@ -25,7 +25,6 @@ on:
     paths:
       - .github/workflows/dubboctl-ui-update.yaml
       - ui-vue3/**
-      - Makefile
   # Trigger the workflow when a pull request is opened or updated.
   # This is to make sure the build process would not be broken by the
   # changes in the pull request.
@@ -35,7 +34,6 @@ on:
     paths:
       - .github/workflows/dubboctl-ui-update.yaml
       - ui-vue3/**
-      - Makefile
 
 jobs:
   lint:
@@ -64,11 +62,27 @@ jobs:
   update-ui:
     runs-on: ubuntu-latest
     if: github.repository == 'apache/dubbo-kubernetes'
+    defaults:
+      run:
+        working-directory: ui-vue3
     steps:
       - uses: actions/checkout@v4
 
+      - name: Setup Node.js environment
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: "ui-vue3/.nvmrc"
+
+      - name: Install dependencies
+        run: yarn --frozen-lockfile
+
       - name: Run Dubboctl UI build
-        run: make build-ui
+        run: yarn build
+
+      - name: Move build artifacts
+        run: |
+          rm -rf ../app/dubbo-ui/dist/
+          mv dist/ ../app/dubbo-ui/dist/
 
       - name: Create PR if the build is changed
         # This step will be skipped if the workflow is triggered by a pull request.
diff --git a/ui-vue3/Dockerfile b/ui-vue3/Dockerfile
deleted file mode 100644
index 8e90848c8..000000000
--- a/ui-vue3/Dockerfile
+++ /dev/null
@@ -1,37 +0,0 @@
-# Licensed to the Apache Software Foundation (ASF) under one or more
-# contributor license agreements.  See the NOTICE file distributed with
-# this work for additional information regarding copyright ownership.
-# The ASF licenses this file to You under the Apache License, Version 2.0
-# (the "License"); you may not use this file except in compliance with
-# the License.  You may obtain a copy of the License at
-#
-#     http://www.apache.org/licenses/LICENSE-2.0
-#
-# Unless required by applicable law or agreed to in writing, software
-# distributed under the License is distributed on an "AS IS" BASIS,
-# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-# See the License for the specific language governing permissions and
-# limitations under the License.
-
-# -- ARGUMENTS --
-ARG  NODE_VERSION
-
-# -- BUILD --
-FROM node:${NODE_VERSION}-alpine as build
-
-WORKDIR /app/ui/src
-
-COPY . .
-
-RUN yarn --frozen-lockfile
-RUN yarn build
-
-# -- RELEASE --
-FROM nginx:stable-alpine as release
-
-COPY --from=build /app/ui/src/dist /usr/share/nginx/html
-
-WORKDIR /usr/share/nginx/html
-EXPOSE 80
-
-CMD ["/bin/sh", "-c", "nginx -g \"daemon off;\""]
diff --git a/ui-vue3/README.md b/ui-vue3/README.md
index db22c0bb3..549c2c766 100644
--- a/ui-vue3/README.md
+++ b/ui-vue3/README.md
@@ -5,6 +5,7 @@
 `Vue3` `Vite` `TypeScript` `Ant Design Vue` `AntV|echarts` `lodash` `i18n` `colorful theme`
 
 ## Introduction
+
 This project is the front-end of dubbo-kube.
 
 1. home
@@ -44,6 +45,7 @@ yarn add ant-design-vue@4.x
 ```
 
 ## Develop
+
 1. todo
 > if a function is not complete but show the entry in your page, 
 > please use notification.todo to mark it
@@ -245,8 +247,20 @@ function globalQuestion() {
    },
    ```
 
-   
+## Build and Deploy
 
-   
+1. Build
 
-   
\ No newline at end of file
+   ```shell
+   yarn build
+   ```
+
+2. Deploy
+
+   Copy the `dist` folder to the path `app/dubbo-ui/dist/`
+
+   ```shell
+   # run the following command in the root path of the project
+   rm -rf app/dubbo-ui/dist
+   cp -r dist/ app/dubbo-ui/
+   ```
diff --git a/ui-vue3/package.json b/ui-vue3/package.json
index 58cec06a0..b064f9561 100644
--- a/ui-vue3/package.json
+++ b/ui-vue3/package.json
@@ -13,7 +13,7 @@
     "type-check": "vue-tsc --build --force",
     "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --ignore-path .gitignore",
     "lint:fix": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore",
-    "prepare": "husky install",
+    "prepare": "husky || true",
     "prettier-format": "prettier --write src/",
     "prettier-check": "prettier --check src/"
   },