Docker Sharing Source Code via Windows

Windows 10 machine running Docker Desktop via WSL2…
Using Cmder shell tool for Windows.

TL;DR:
Running these docker commands all fail to detect the source code change.
Creating a new container does show the change from the previous attempt.
But none of the following attempts showed changes while the container was running.

Attempt #1:
docker run -d -p 5001:3000 --name wind-sock -v ${pwd}:/app react-app

Result #1:
docker: Error response from daemon: create ${pwd}: “${pwd}” includes invalid characters for a local volume name, only “[a-zA-Z0-9][a-zA-Z0-9_.-]” are allowed. If you intended to pass a host directory, use absolute path.

Attempt #2:
docker run -d -p 5001:3000 --name wind-sock -v ${PWD}:/app react-app

Result #2:
docker: Error response from daemon: create ${PWD}: “${PWD}” includes invalid characters for a local volume name, only “[a-zA-Z0-9][a-zA-Z0-9_.-]” are allowed. If you intended to pass a host directory, use absolute path.

Attempt #3:
docker run -d -p 5001:3000 --name wind-sock -v “%cd%”:/app react-app

Result #3:
The container created successfully. However, when you make a change to react-app/public/index.html – nothing happens.

Attempt #4:
docker run -d -p 5001:3000 --name wind-sock -v //c/x-apps/docker-work/react-app:/app react-app

Result #4:
The container created successfully. However, when you make a change to react-app/public/index.html – again, nothing happens.

Attempt #5:
docker run -d -p 5001:3000 --name wind-sock -v c:\x-apps\docker-work\react-app:/app react-app

Result #5:
The container created successfully. However, when you make a change to react-app/public/index.html – yet again, nothing happens.

Any thoughts?

Cheers,
Kyle

Opened up Powershell and tried:
docker run -d -p 5001:3000 --name wind-sock -v ${PWD}:/app react-app

Nope. Only when the container restarted did it show the change.
Powershell had no impact on runtime changes. :frowning:

Still searching for a solution…

Uploaded the latest Docker Desktop v3.3.3 – No impact.

Then I found a few more versions of the syntax:

Attempt #6
docker run -d -p 5001:3000 --name wind-sock -v /$(pwd):/app react-app


Attempt #7
Using PowerShell
MSYS_NO_PATHCONV=1 docker run -d -p 5001:3000 --name wind-sock -v /c/x-apps/docker-work/react-app:/app react-app


Attempt #8
Using GIT Shell
winpty docker run -d -p 5001:3000 --name wind-sock -v /$(pwd):/app react-app


Attempt #9
docker run -v C:\x-apps\docker-work\react-app:/app -d -p 5001:3000 --name wind-sock react-app

Attempt #10
docker run -v /c/x-apps/docker-work/react-app:/app -d -p 5001:3000 --name wind-sock react-app

I still cannot repeat the updated behavior Mosh was able to create in the video.
Some of these Attempts create stable containers – some do not.
But none of them allow me to change the TITLE tag and see an instant update in the browser.
I have to restart the container to get anything new to show up.

I’m stumped…

Why won’t it update instantly as it does in Mosh’s video?
Permissions? Do I have to share the folders? Tried that. Nothing.
Do I have to only use the USER folders? That means moving the entire project. That doesn’t seem realistic.
Is there something blocking the connection?
No. Because the React app shows up once the container finishes loading.

So what is the deal? Arrggg… so frustrated with this tiny problem.

man could you send to me vidly project that attached to docker course to test if we have same errors ?
email: khiterab31@gmail.com

I’m having the same issue i’ve been using the following command

 docker run -d -p 5005:3000 -v ${pwd}:/app react-app

The files indeed get updated in the container, but no reflection of changes unless i stop and restart the container.

Someone else mentioned it could have something to do with nodemod?

I’m stumped.

The following solution worked for me for getting the react app to hot reload

Snippet from the page above:

You can create a .env file in your project directory if you don’t already have one and add

`CHOKIDAR_USEPOLLING=true
FAST_REFRESH=false

to the .env` file.

Or you can edit your package.json file like so:
{
“scripts”: {
“start”: “`CHOKIDAR_USEPOLLING=true FAST_REFRESH=false react-scripts start”,
“build”: “react-scripts build”,
“test”: “react-scripts test”,
“eject”: “react-scripts eject”
}
}

1 Like