6

Project setup

I have a Typescript project I'm running in a local Docker container. I have the following two volumes (this is in docker-compose.yml):

volumes:
  - .:/node/app

This first volume is a bind mount, to copy in my app's source code into the container.

  - /node/app/node_modules/

This second volume is inside the bind mount. This means that when an npm install runs inside the container, in the project's /node/app working directory, the dependencies will be installed into the node_modules folder in the container only.

My understanding is this is a common practice to allow the host and the container to have separate node_modules. My intention for this setup is to install and run some tools in the host only, like prettier, so I can npm install --only=development in the host, and get prettier installed, as its specified as a devDependency, and now my editor can use prettier.

The problem

In my editor, when the typescript compiler runs, it shows me "Cannot find module" errors:

cannot find module errors in visual studio code

My understanding is this happens because those modules aren't on disk. This is because of my above setup. I have made the node_modules containing my non-dev dependencies, like React, only available inside the container.

My question

I'm new to Docker, and my understanding is it's generally good to do things inside the container, including development. I'm trying to avoid an npm install in the host, because I don't really want or need all of the dependencies in the host. I also don't want to have to npm install twice, once on host and once in container, when adding a new dependency.

Is there a way to stop Typescript from erroring if the node_modules imported aren't present (like only load their typing definitions, maye?), or is there a way to point Typescript's compiler in Visual Studio Code somehow to the container, so it can see them without having to install them on the host, while still letting me install other dependencies on the host, like prettier?

Or is the only way to npm install on the host?

Andy Ray
  • 30,372
  • 14
  • 101
  • 138
  • I ran into the same scenario and one option I found is to use the Remote - Containers extension if you use VSCode. It lets you plug into the container and work directly there. [link](https://code.visualstudio.com/docs/remote/containers) – Gonzalo Muro Oct 06 '21 at 19:19

2 Answers2

0

Mounting a separate volume for node_modules would be common if you wanted to install modules both inside and outside docker. For example, if you wanted to run your project outside of docker containers, and be able to run it in the docker containers.

What you are suggesting, having some modules inside the container and others outside, I'm not sure there's any need for that. Perhaps the better solution would be to just run prettier inside your docker container...

services:
    prettier:
        image: node:latest
        volumes:
            - .:/node/app
        working_dir: /node/app
        entrypoint: npx prettier

Then you can run

docker-compose run --rm prettier <options>
Rob
  • 12,659
  • 4
  • 39
  • 56
0

I never heard of this kind of "seperation". Have you some sources for me, that explain why this is "good" (as comment)?

And my answer: You can change the path of node_modules-directory. Have a look to Specify path to node_modules in package.json

So you can define a mount-point in docker to a local folder. Read this How-to.
And this folder, you can define in npm. Maybe you have to change the running user of your docker-container, so the file-permissions will match with your host.

But ...

I highly recommend to use npm like as it is supposed to use. Install it on your host-machine and use the project-local node_modules-folder. It will be much easier as the docker-volume-hack.

akop
  • 5,981
  • 6
  • 24
  • 51