Deployment to App Engine using Cloudbuild failing-CodePudding

I've built a Node Vue JS project that is structured with different directories for the frontend and backend code. /api is the backend code with its own package.json and ui is the frontend code with its own package.json. The project is structured like this:

/app
  /api
    package.json
  /ui
    package.json
  /config
    cloudbuild.yaml

I am attempting to deploy the project to App Engine using Cloudbuild. The cloudbuild.yaml file is structured like this:

steps:
- name: gcr.io/cloud-builders/gcloud:latest
  entrypoint: "ls"
  args: ["-lah","/workspace"]
- name: node
  entrypoint: yarn
  args: ["install"]
  dir: "api"
- name: node
  entrypoint: yarn
  args: ['global', 'add', '@vue/cli']
  dir: "ui"
- name: node
  entrypoint: yarn
  args: ['run', 'build']
  dir: "ui"
- name: "gcr.io/cloud-builders/gcloud"
  args: ["app", "deploy", "./app.yaml"]
timeout: "1600s"

Steps 0-2 complete successfully, but the build fails when it comes to building the Vue application for production, specifically the command of yarn run build. This command is listed in the /ui directory's package.json as vue-cli-service build.

The error is /bin/sh: 1: vue-cli-service: not found

It seems that Cloudbuild can't find vue-cli as if its not installed OR it doesn't know what to build.

My question is how can I deploy a project with separate directories to App Engine with Cloudbuild?

CodePudding user response：

One of the core principle of Cloud Build, is to start from a next execution context at each step. only the /workspace directory is kept between each step.

In your 3rd step, you install globally your vue cli, therefore, not in your current directory (a subdirectory of workspace), but it the container runtime directory (/etc or somewhere else; in any cases, not under workspace.

If you remove the global parameter, you will install the library locally of your app directory (under /workspace) and therefore the install will persist for the following steps.