vue-cli-service: not found inside Docker

[fuad008]

Version

4.1.2

Reproduction link

https://github.com/engblh/docker-for-vue-dev

Environment info

Environment Info:

  System:
    OS: Linux 4.19 Debian GNU/Linux 9 (stretch) 9 (stretch)
    CPU: (2) x64 Intel(R) Core(TM) i5-8265U CPU @ 1.60GHz
  Binaries:
    Node: 10.15.0 - /usr/local/bin/node
    Yarn: 1.12.3 - /usr/local/bin/yarn
    npm: 6.13.6 - /usr/local/bin/npm
  Browsers:
    Chrome: Not Found
    Firefox: Not Found
  npmGlobalPackages:
    @vue/cli: 4.1.2

Steps to reproduce

1. Git clone
2. cd docker-for-vue-dev
3. Docker-compose up

Environment used:

docker version 2.2.0.0(42247) win 10 and WSL ubuntu 18.04

Docker engine 19.03.5, compose v1.25.2

What is expected?

expected to show default vue homepage

What is actually happening?

Successfully built 4166371f2e1a
Successfully tagged docker-vue:latest
Creating docker-vue ... done
Attaching to docker-vue
docker-vue |
docker-vue | > [email protected] serve /var/www/docker-vue
docker-vue | > vue-cli-service serve
docker-vue |
docker-vue | sh: 1: vue-cli-service: not found
docker-vue | npm ERR! file sh
docker-vue | npm ERR! code ELIFECYCLE
docker-vue | npm ERR! errno ENOENT
docker-vue | npm ERR! syscall spawn
docker-vue | npm ERR! [email protected] serve: vue-cli-service serve
docker-vue | npm ERR! spawn ENOENT
docker-vue | npm ERR!
docker-vue | npm ERR! Failed at the [email protected] serve script.
docker-vue | npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
docker-vue |
docker-vue | npm ERR! A complete log of this run can be found in:
docker-vue | npm ERR! /root/.npm/_logs/2020-01-24T15_45_29_935Z-debug.log

---

It was working a couple days ago on win 10, WSL ubuntu 18.04, but problem started happening since yesterday.

It works on MacOS, but not on Win 10, WSL Ubuntu 18.04

[levifarley]

Also having this exact same issue right now. It works in Docker on macOS, but not Docker on Windows. But if I start the container through docker and attach shell to it and run vue-cli -v it recognizes it is installed.

If it makes any difference, a buddy was able to get the exact same repo/dockerfile working first try on his Windows 10 machine. 🤷‍♂ So its not Docker for Windows wide, but a problem with our individual PCs. As to what the problem is, I have no clue.

[camper6]

Also having this exact same issue right now. It works in Docker on macOS, but not Docker on Windows. But if I start the container through docker and attach shell to it and run vue-cli -v it recognizes it is installed.

Running that command didn't work for me in my docker-compose command. It would just say: sh: 1: vue-cli: not found. Running @vue/cli -v also says the same. Even running vue --version says not found.

Strangely enough, if I have npm install locally on my own project, and then use docker to serve (using a pre-existing container). It will get pass those issues but the brick wall I hit is the docker's node_modules' node-sass isn't based on linux's (what the docker's environment based of), it's based on Window's environment... my local build. The container does not shut down by this error, so getting inside the docker container and running npm rebuild node-sass would download the correct node-sass, then restarting the container works.

...Removing my local node-modules (cut and paste it outside the project), and running serve again with docker would get vue-cli-service: not found. But if I switch the npm run serve with ls node-modules in my docker-compose's command, I will find docker still has its own node-modules packages installed as it should, due to anonymous volume setup on the node_modules in the docker-compose yml.

All I can say, I'm very confused what's going on. Is anonymous volume working properly? When docker builds the image, is it installing the packages properly? I suspect something went wrong in the installing, since in a fresh clean project without a local installed node-modules, the vue docker instance does not recognize any vue or vue cli's commands when I try to run it through docker-compose command or CMD in dockerfile (although RUN works but I won't be able to get out of the building stage).

[levifarley]

@camper6 I think i'm having a similar issue as you. If my Dockerfile has RUN npm install and I build the image, it shows npm installs everything successfully. Then when I run docker run -v ${PWD}:/app -v /app/node_modules -p 3000:8080 --rm app:test it dies immediately with error sh: vue-cli-service: not found.

So I'll tell you what I have tried.

• I ensured Docker settings are showing my C drive is shared. I've verified in the Windows 10 registry, drive preferences in both security and sharing tabs, that sharing is enabled for my Windows user account.
• I ran docker run -v ${PWD}:/app -v /app/node_modules debian:stable -tty to fire up a simple debian container, attached a shell, and ran ls app and all my local project files are there, so its attaching the volume to share with my local Windows 10 host.
• Out of curiosity, I ran apt update && apt install npm then npm install and it installed everything from my package.json file properly. I watched my Windows Explorer window fill up with package when it finished the install, again this verifies it IS sharing the volume between container and host OS
• Even though my package.json has @vue/cli-service listed in its dependencies, i added RUN npm install @vue/cli-service to the Dockerfile after npm install and before CMD ["run", "dev", "serve"], and it shows it installs the @vue/cli-service package successfully. Very next command I run is the docker run -v ${PWD}:/app -v /app/node_modules -p 3000:8080 --rm app:test command, it errors with the same sh: vue-cli-service: not found message.
• If instead of using volumes I simply use ADD . /app to my Dockerfile and copy everything directly from my local project files to the container and run docker run -p 3000:8080 app:test, everything works properly and I can see my app in a browser. But this isn't a solution as I need the container to reflect file changes during development.

I've about exhausted everything I can think of right now.

[tjeerddie]

I have the same problem, haven't found a way to fix vue-cli-service not found with npm.
I did find a way to serve vue using this hacky command which runs it directly from within node_modules:
node /node_modules/@vue/cli-service/bin/vue-cli-service.js serve

[levifarley]

It seems npm install isn't actually installing dependencies, or they are getting overritten when you start the container so the node_modules directory is empty causing the issue. The only work around I figured out was to remove the RUN npm install from the Dockerfile, and just start the container up and attach a shell to it and run npm install manually, then it works properly.

Downside is that you have to run npm install every time that you start the container. Upside is that your dependencies always stay up to date and its finally usable. Seems like the problem for me is just on Docker for Windows, as I don't experience the same problem on MacOS.

[jolyjf]

Same here. When I mount _src_ in a Windows folder npm install doesn't populate node_modules correctly and vue-cli-service does not exist.

[sodatea]

Considering this issue does not happen on macOS, this might be a bug in Docker for Windows.
And the most recent release notes cited a lot of volume-related bugs (https://docs.docker.com/docker-for-windows/release-notes/), would you please upgrade Docker for Windows to the latest and try again?

[jolyjf]

I found my problem. I was inadvertently setting NODE_ENV to _production_ in my docker-compose so all NPM dev dependencies (including vue-cli-service) were not being installed.

[appleboy]

We need to separate the CI/CD flow as below:

steps:
- name: install
  image: node:13
  commands:
  - npm install

- name: build
  image: node:13
  environment:
    NODE_ENV: production
  commands:
  - npm run build

[bitsofinfo]

same issue, in builds in Kaniko

[Azurox]

Hi everyone, same error on my server with node_env set as production, removing it or installing all dependecies with --only=dev works but its dam ugly.
I don't know what is the final word on this, if @vue/cli-service is mandatory to build, why is it in devDepencies ? Is installing @vue/cli as a global npm depency on a production server really a good solution ?
Multiple people seems to have the same problem #2404 and there seems to be no final word on this

[sodatea]

Production means only the built bundle is to serve.

[sodatea]

Pre-configured NODE_ENV is meaningful only when there's a Node.js server to run.

In the context of Vue.js apps, it's for server-side rendering or static assets hosting.

For a production Node.js server, you won't need any of the src/* stuff and they should never be pushed to a production server.

• Only the built dist/ bundles are required to run the server-side rendering.
• Only the built dist/ bundles are to be served in an asset server.

---

The bundles should be built in the CI/CD pipeline. You should not pre-configure NODE_ENV in these servers. Because by definition, they need to:

• Install all the dev utilities to process the testing, building… This task requires NODE_ENV to be development or empty.
• Run the unit tests, which requires NODE_ENV to be test.
• Build the production assets, run E2E tests, which requires NODE_ENV to be production.

---

So in conclusion: NODE_ENV should be set on the fly for any tasks except for the real production servers. And @vue/cli-service is not meant to be used in that kind of server.

[BenjaminGuillot]

Same issue.
This post work for me ;)
Thx @sodatea

[amaurybrisou]

In Github Actions docker I had the issue even in NODE_ENV=development.

A quick fix that did work for me is to install @vue/cli-service globally with this command npm install -g @vue/cli-service