时间戳

首页 > 解决方案 > Dockerfile 在几个环境中部署 Vue.js 应用程序？

docker - Dockerfile 在几个环境中部署 Vue.js 应用程序？

问题描述

我正在尝试创建一个 Dockerfile 以将 Vue.js 应用程序部署为 Cloud Run (GCP) 中的 docker。从 Vue 官方文档中获取 Dockerfile 以在“生产模式”下部署应用程序：

FROM node:lts-alpine
RUN npm install -g http-server
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
EXPOSE 8080
CMD [ "http-server", "dist" ]

它工作正常，但我想修改 Dockerfile 以使其动态化。我的意思是，我希望这个文件能够使用一种输入参数部署到生产或 DEV

我尝试了几次尝试，其中之一是添加这些新行

ENV ENT=production
RUN NODE_ENV=${ENT} npm run build

意图将环境变量的默认值定义为“生产”，并在 Cloud Run 服务中将相同的环境变量定义为“开发”。我以为在云运行服务上定义的变量会在运行docker的那一刻覆盖本地变量（Dockerfile）。它没有被覆盖，并且该应用程序再次在生产中运行

你知道是否有办法覆盖 Dockerfile 环境变量，或者是否可以创建一些东西

npm run build:dev
npm run build:prod

动态取决于我要部署的环境？

这是我的package.json

{
  /// ...
  "scripts": {
    "dev": "vue-cli-service serve --mode development",
    "test": "cross-env NODE_ENV=testing vue-cli-service serve --mode testing",
    "prod": "vue-cli-service serve --mode production",
    "build:dev": "vue-cli-service build --mode development",
    "build": "vue-cli-service build --mode production",
    "lint": "vue-cli-service lint"
  },
  /// ...
}

标签： dockervue.jsgoogle-cloud-platformdockerfiledevops

解决方案

根据 Muni Kumar 的回答，我找到了一种方法，因为在 GCP 中部署容器的工具有点棘手。Cloud build 以创建 docker 映像和 Cloud Run 以部署它

在脚本中：

"build:dev": "vue-cli-service build --mode development",
"build:prod": "vue-cli-service build --mode production",

在 Dockerfile 中：

ARG ENV
RUN npm run build:${ENV}

名为：cloudbuild.yaml的新文件，用于向 Cloud Build 添加一些自定义配置

steps:
- name: 'gcr.io/cloud-builders/docker'
  args: ['build',
         '--build-arg',
        'ENV=${_ENV}',
         '-t',
         'gcr.io/$PROJECT_ID/landing',
         '.']
substitutions:
    _ENV: test # default value
images: [
    'gcr.io/$PROJECT_ID/landing',
]

并且，创建运行下一个命令

gcloud builds submit --config=cloudbuild.yaml --substitutions=_ENV="prod"

推荐阅读