如何使用 Cloud Native Buildpacks 构建服务于 Vue SPA 的容器

Question

目前我正在尝试通过 Cloud Native Buildpacks 构建服务于 VueJS 应用程序的容器。

我已经有了在生产模式下构建 VueJS 的工作 Docker 文件，然后将结果复制到 nginx 图像，但我想尝试使用 CNB。

所以我刚刚通过 vue create vue-tutorial 创建了用于测试的空 VueJS 项目，并尝试像那里描述的那样使用 CNB 做一些事情 https://cli.vuejs.org/guide/deployment.html#heroku 但使用 CNB。

有谁知道如何用 CNB 做到这一点的工作秘诀吗？

P.S。目前我正在尝试使用

构建它

pack build spa --path . \                                              SIGINT(2) ↵  17:22:41
  --buildpack  gcr.io/paketo-buildpacks/nodejs \
  --buildpack  gcr.io/paketo-buildpacks/nginx

但遇到下一个错误（我不确定我的方法是否正确）：

===> DETECTING
ERROR: No buildpack groups passed detection.
ERROR: Please check that you are running against the correct path.
ERROR: failed to detect: no buildpacks participating
ERROR: failed to build: executing lifecycle: failed with status code: 100

UPD 我当前的 dockerfile

# build stage
FROM node:lts-alpine as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
# production stage
FROM nginx:1.19-alpine as production-stage
COPY --from=build-stage /app/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Answer 1

我们在 Slack 上聊过这个，但我也想在这里捕捉它：

pack build --buildpack heroku/nodejs --buildpack https://cnb-shim.herokuapp.com/v1/heroku-community/static yourimage

这个命令可能会做你想做的事。该示例中使用的静态 buildpack 尚未转换为云原生 buildpack，但 shim 可能允许您构建可行的工件。然后运行你的图片加上 docker run -it -e PORT=5000 -p 5000:5000 yourimagename

如何使用 Cloud Native Buildpacks 构建服务于 Vue SPA 的容器

How to build container serving Vue SPA using Cloud Native Buildpacks

vue.js

buildpack

paketo