apache部署vue项目

在Kubernetes（K8S）环境中部署Vue项目是一个常见的操作，而结合Apache服务器的部署方式可以让我们更好地管理和扩展我们的应用程序。在本篇文章中，我将会向你详细介绍如何在K8S环境中使用Apache服务器部署Vue项目。

### 步骤概览
下表是部署Vue项目到K8S环境中使用Apache服务器的整体流程：

| 步骤 | 操作 |
| --- | --- |
| 1 | 创建Vue项目 |
| 2 | 构建Vue项目 |
| 3 | 创建Apache服务器镜像 |
| 4 | 创建Deployment并暴露Service |
| 5 | 部署Vue项目到K8S |

### 具体操作步骤

#### 步骤一：创建Vue项目
首先，我们需要创建一个Vue项目。执行以下命令：

```bash
vue create my-project
```

#### 步骤二：构建Vue项目
在Vue项目根目录下执行以下命令，用于构建Vue项目：

```bash
npm run build
```

#### 步骤三：创建Apache服务器镜像
创建一个Dockerfile文件，内容如下：
```Dockerfile
FROM httpd:2.4
COPY ./dist/ /usr/local/apache2/htdocs/
```

然后执行以下命令构建Apache镜像：
```bash
docker build -t my-apache .
```

#### 步骤四：创建Deployment并暴露Service
创建一个deployment.yaml文件，内容如下：
```yaml
apiVersion: apps/v1
kind: Deployment
metadata:
name: apache-vue
spec:
replicas: 1
selector:
matchLabels:
app: apache-vue
template:
metadata:
labels:
app: apache-vue
spec:
containers:
- name: apache-vue
image: my-apache
ports:
- containerPort: 80
---
apiVersion: v1
kind: Service
metadata:
name: apache-vue
spec:
type: NodePort
ports:
- port: 80
targetPort: 80
nodePort: 30001
selector:
app: apache-vue
```

然后执行以下命令创建Deployment和Service：
```bash
kubectl apply -f deployment.yaml
```

#### 步骤五：部署Vue项目到K8S
部署Vue项目到K8S环境中，执行以下命令：
```bash
kubectl port-forward service/apache-vue 8080:80
```

现在，你的Vue项目已经成功部署到K8S环境中，并可以通过 http://localhost:8080 访问到。

通过以上步骤，你已经学会了如何在K8S环境中使用Apache服务器部署Vue项目。希望这篇文章对你有所帮助！