在 Kubernetes 中部署 Vue 前端需要一些準備工作和配置步驟。以下是一個簡單的指南，幫助您成功地將 Vue 應用部署到 Kubernetes 集群中。

首先，您需要創建一個 Docker 鏡像，其中包含您的 Vue 應用程序。使用以下 Dockerfile 示例：

FROM node:alpine
WORKDIR /app
COPY package.json .
RUN npm install
COPY . .
RUN npm run build
FROM nginx:alpine
COPY --from=0 /app/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

該 Dockerfile 首先使用 Node.js 運行時作為基礎鏡像。接著，它將所有應用程序文件復制到工作目錄，并運行 NPM 安裝。最后，它使用 Vue CLI 構建應用程序。然后，它使用 Nginx 鏡像作為基礎鏡像，并將 Vue 應用構建的 dist 文件夾復制到 Nginx 靜態資產存儲目錄。最后，它暴露端口 80 并啟動 Nginx。

為了在 Kubernetes 中創建部署并啟動這個鏡像，您需要編寫一個 YAML 文件。以下是一個示例 YAML 文件：

apiVersion: apps/v1
kind: Deployment
metadata:
name: my-vue-app
spec:
replicas: 3
selector:
matchLabels:
app: my-vue-app
template:
metadata:
labels:
app: my-vue-app
spec:
containers:
- name: my-vue-app
image: your-docker-repo/my-vue-app
ports:
- containerPort: 80
volumeMounts:
- name: config-volume
mountPath: /etc/config
volumes:
- name: config-volume
configMap:
name: my-app-config
---
apiVersion: v1
kind: Service
metadata:
name: my-vue-app
spec:
selector:
app: my-vue-app
ports:
- name: http
port: 80
targetPort: 80

上面的 YAML 文件定義了一個名為 my-vue-app 的 Kubernetes 部署，它有三個副本和一個名為 my-vue-app 的 Kubernetes 服務。該部署使用之前創建的鏡像，并將端口 80 映射到容器端口。它還將配置文件作為 configMap 的卷掛載，以便應用程序可以從容器的 /etc/config 目錄讀取配置。

最后一步是使用 kubectl 命令將 YAML 文件應用于 Kubernetes 集群：

$ kubectl apply -f my-vue-app.yaml

現在您的 Vue 應用程序應該已經在 Kubernetes 集群中成功運行了。