docker compose 部署vue linux
时间: 2025-01-30 11:08:49 浏览: 37
### 使用 Docker Compose 部署 Vue 项目
#### 准备工作环境
为了成功部署 Vue 项目,需确保本地已安装 Node.js 和 NPM 来处理前端依赖项。接着,在项目的根目录下执行 `npm install` 命令来下载并配置所需的 node_modules 文件夹[^1]。
```bash
npm install
```
#### 构建生产版本
完成上述操作后,应运行构建脚本以生成用于生产的 dist 文件夹,该文件夹包含了编译后的静态资源文件。这一步骤可通过 npm 脚本来实现:
```bash
npm run build
```
此命令会依据 package.json 中定义的 script 字段下的 "build" 指令来进行打包过程。
#### 创建 Dockerfile 及其他必要文件
对于基于 NGINX 的 Web 应用程序来说,通常还需要准备一个名为 `Dockerfile` 的文件以及自定义的 `nginx.conf` 文件以便更好地控制服务器行为。这些文件应该放置于项目的根目录中,并且应当包含将之前提到的 dist 文件夹复制到 NGINX 容器内的指令[^3]。
##### 示例 Dockerfile 内容如下:
```dockerfile
FROM nginx:alpine
COPY ./dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
```
#### 编写 docker-compose.yml 文件
最后一步是在同一路径下编写 `docker-compose.yml` 文件,用来描述整个应用程序的服务架构及其关联关系。这里展示了一个简单的例子,其中指定了如何利用前面创建好的镜像启动服务[^4]。
```yaml
version: '3'
services:
web:
build: .
ports:
- "9527:80"
volumes:
- ./:/app
```
#### 执行构建与启动流程
当所有的准备工作完成后,可以通过下面两条命令依次完成镜像的构建和服务实例化的工作。前者负责按照指定的方式制作出可执行的应用镜像;后者则让容器正式上线运作起来。
```bash
docker-compose build
docker-compose up -d
```
阅读全文
相关推荐

















