在docker-compose之前重新编译VueJS应用

Question

我想在docker nginx容器中部署vueJS应用，但是在该容器运行之前，必须通过npm run build编译vueJS源，我想在容器中运行编译然后退出，仅保留已编译的结果Nginx容器。

每次运行docker-compose up时，都必须重新编译vueJS应用程序，因为主机OS上有一个.env文件必须进行卷挂载，并且此处的变量可以更新。

我认为理想的方法是像gitlab ci中那样为docker compose创建阶段的某种方式，这样会有一个构建阶段，当结束时，nginx容器就会启动。但是当我抬起头来时，我看不到任何方法。

每次运行docker-compose up时，编译我的vueJS应用的最佳方法是什么？

Answer 1

如果您已经将Vue.js应用程序构建到具有Dockerfile的容器中，则可以在build文件中使用docker-compose.yml指令。这样，您可以使用docker-compose build手动创建容器，也可以使用run --build来构建容器，然后再启动它们。

例如，此Compose文件使用容器构建文件而不是预构建映像来定义服务：

version: '3'
services:
  vueapp:
    build: ./my_app  # There should be a Dockerfile in this directory

这意味着我既可以构建容器也可以分别运行服务：

docker-compose build
docker-compose up

或者，我可以使用build-before-run选项：

# Build containers, and recreate if necessary (build cache will be used)
docker-compose up --build

如果您的.env文件发生了更改（并且容器在重新启动时未接收到更改），则可以考虑在容器构建文件中定义它们。否则，请考虑将.env文件放入目录中（并挂载该目录，而不是挂载该文件，因为某些编辑器将使用交换文件并更改inode-这会中断挂载）。如果您挂载目录并更改目录中的文件，则更改将反映在容器中，因为父目录的inode不变。

Answer 2

我最终有了一个nginx容器，该容器从卷安装中读取文件，还有一个容器，用于构建应用程序并将文件放置在同一卷中。在编译应用程序时，nginx会读取旧版本，编译完成后，文件将被新文件替换。