vue项目模块的Docker生成未找到错误

Question

我正在尝试构建一个vue应用程序停靠器映像，但是我一直收到这个错误。

未找到

模块:错误:无法解决'./src/main.js‘中的'/app’

我使用的是一个多级文件

FROM node:15.4 as build

WORKDIR /app

COPY ./frontend/package.json .

RUN npm install

COPY . .

RUN npm run build


FROM nginx:1.19

COPY ./frontend/nginx/nginx.conf /etc/nginx/nginx.conf

COPY --from=build /app/dist /usr/share/nginx/html

以下是package.json文件的脚本部分

"scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },

这是构建过程的详细日志。

[+] Building 26.9s (14/16)                                                                                                               
 => [internal] load build definition from frontend.dockerfile                                                                       0.0s
 => => transferring dockerfile: 293B                                                                                                0.0s
 => [internal] load .dockerignore                                                                                                   0.0s
 => => transferring context: 34B                                                                                                    0.0s
 => [internal] load metadata for docker.io/library/nginx:1.19                                                                       2.5s
 => [internal] load metadata for docker.io/library/node:15.4                                                                        2.4s
 => [auth] library/node:pull token for registry-1.docker.io                                                                         0.0s
 => [auth] library/nginx:pull token for registry-1.docker.io                                                                        0.0s
 => [build 1/6] FROM docker.io/library/node:15.4@sha256:a76eb778d162f8fd96138d9ca7dbd14b8916c201775a97d2f2aa22e9f13eb105            0.0s
 => [stage-1 1/3] FROM docker.io/library/nginx:1.19@sha256:df13abe416e37eb3db4722840dd479b00ba193ac6606e7902331dcea50f4f1f2         0.0s
 => [internal] load build context                                                                                                   8.5s
 => => transferring context: 166.03MB                                                                                               8.4s
 => CACHED [build 2/6] WORKDIR /app                                                                                                 0.0s
 => CACHED [build 3/6] COPY ./frontend/package.json .                                                                               0.0s
 => CACHED [build 4/6] RUN npm install                                                                                              0.0s
 => [build 5/6] COPY . .                                                                                                            7.4s
 => ERROR [build 6/6] RUN npm run build                                                                                             8.3s
------                                                                                                                                   
 > [build 6/6] RUN npm run build:                                                                                                        
#14 2.913 
#14 2.913 > frontend@0.1.0 build
#14 2.913 > vue-cli-service build
#14 2.913 
#14 4.668 All browser targets in the browserslist configuration have supported ES module.

我将前端文件夹从项目移动到独立，并且我能够成功地构建映像并运行一个基于它的容器。

​

这里有什么问题吗？

Answer 1

我试着给你点帮助。首先，我假设您的nginx.conf文件位于nginx文件夹的上层。我在你的回购中看到了两个。如果是这样的话，您将把一个层复制到深层。我建议按以下顺序修改您的文件：

FROM node:alpine as build
WORKDIR /app
COPY ./package*.json ./
RUN npm install
COPY "frontend/target/dist" ./

FROM nginx:alpine as production
COPY ./frontend/nginx/nginx.conf /etc/nginx/conf.d/nginx.conf
RUN rm -rf /usr/share/nginx/html/*
COPY --from=build /app /usr/share/nginx/html

我更改的是您要添加的文件夹层和package.json中的asterix (package.json)。如果您之前定义了一个前端，那么您也要在复制的部分中搜索它，这在nginx映像中不存在。而且，正如您所看到的，您只需要/app而不是/app/dist。另外，您的/etc...配置路径被错误引用。现在就试一试。我得到的信息应该是这样的。

只在.dockerignore文件中添加以下行：

node_modules
dist