docker-spfx
docker-spfx copied to clipboard
pnp
SPFx:1.11.0 - Run docker for an existing project - Permission Denied
I have some questions about how to run docker for spfx. Some time ago I started a project in version SPFx 1.11.0. I've heard of docker before, but I thought it was unnecessary, currently, I would like to develop other things, but already in the new version SPFx 1.13.1 (for the currentity of libraries, controls, etc.).
First I tried to download an existing image from:
hub.docker.com/r/waldekm/spfx/tags
Command:
docker pull waldekm / spfx: 1.11.0
a Use command:
docker run -it --rm --name spfx-helloworld -v $ {PWD}: / usr / app / spfx -p 4321: 4321 -p 35729: 35729 waldekm / spfx
There was no problem when i was trying to create a new project.
The problem occurred when gulp serve an existing folder / project:
C:\git\SPFx_OldWebpart
The problem is probably that npm install was done against / OS = Windows, while containerization is in Linux.
Procedure for attempting commissioning:
docker run -it --rm --name spfx-helloworld -v $ {PWD}: / usr / app / spfx -p 4321: 4321 -p 35729: 35729 waldekm / spfx: 1.11.0
spfx @ 98ecd3553a8d: /usr/app/spfx $ gulp serve
Error: Missing binding /usr/app/spfx/node_modules/node-sass/vendor/linux-x64-64/binding.node Node Sass could not find a binding for your current environment: Linux 64-bit with Node.js 10.x
Found bindings for the following environments:
- Windows 64-bit with Node.js 10.x
- Windows 64-bit with Unsupported runtime (83)
This usually happens because your environment has changed since running npm install.
Run npm rebuild node-sass to download the binding for your current environment.
Npm install :
Error: EPERM: operation not permitted, unlink '/usr/app/spfx/node_modules/@pnp/common/collections.d.ts.map'
Npm rebuild node-sass:
spfx @ d0eab30de69a: / usr / app / spfx $ npm rebuild node-sass
npm ERR! Error: EPERM: operation not permitted, unlink '/usr/app/spfx/node_modules/.bin/node-sass'
Docker -> Resources -> File sharing - folder added -> permissions work because I couldn't create a new project before, but after restarting OS + docker, I could create atleast new project.
I found a similar error here (not spfx, but a general problem): https://github.com/sass/node-sass/issues/2165 You still need to do this: https://github.com/sass/node-sass/issues/2165#issuecomment-347043659 ?? Or I found another solution here: https://stackoverflow.com/questions/37986800/node-sass-couldnt-find-a-binding-for-your-current-environment https://stackoverflow.com/questions/39293636/npm-err-error-eperm-operation-not-permitted-rename
I don't know which way to go, every solution will lead me to other mistakes.
I also tried to create my own build: from address: https://github.com/waldekmastykarz/docker-spfx/blob/master/Dockerfile Download DockerFile and edit it to fit the version:
FROM node: 10.22.0
EXPOSE 5432 4321 35729
ENV NPM_CONFIG_PREFIX = / usr / app / .npm-global \
PATH = $ PATH: /usr/app/.npm-global/bin
VOLUME / usr / app / spfx
WORKDIR / usr / app / spfx
RUN useradd --create-home --shell / bin / bash spfx && \
usermod -aG sudo spfx && \
chown -R spfx: spfx / usr / app
chown -R spfx: spfx / usr / app / spfx
USER spfx
RUN npm i -g gulp [email protected] @ microsoft / generator-sharepoint @ 1.11.0
CMD / bin / bash
Adding the line chown -R spfx: spfx / usr / app / spfx I found here (though for a different version):
docker-spfx/issues/19
docker build -t spfx-docker: 1.11.0.
docker run
and again leads to the same mistakes ...
Or am I completely out and doing something stupid?
In what environment am I trying to run the docker: Docker:
spfx @ 98ecd3553a8d: / usr / app / spfx $ node --version
v10.22.0
spfx @ 98ecd3553a8d: / usr / app / spfx $ yo --version
3.1.1
spfx @ 98ecd3553a8d: / usr / app / spfx $ gulp --version
[12:32:03] CLI version 3.9.1
[12:32:03] Local version 3.9.1
Or is there a mistake in this: I use VMware Workstation 16 Player
I currently have the latest version of docker: Docker Desktop 4.3.2 (72729) is currently the newest version available.
OS Windows Server 2019.
Have you tried removing node_modules (or move it somewhere for the backup) and trying to run npm install in the container?
I've tried that before. After deleting the folder node_modules and then the npm install command.
I get a thousand lines of warnings and finally an error.
npm WARN tar ENOENT: no such file or directory, open '/usr/app/spfx/node_modules/.staging/office-ui-fabric-react-b64a72f4/lib-amd/Foundation.js'
npm WARN tar ENOENT: no such file or directory, open '/usr/app/spfx/node_modules/.staging/office-ui-fabric-react-b64a72f4/lib-commonjs/Foundation.js'
npm WARN tar ENOENT: no such file or directory, open '/usr/app/spfx/node_modules/.staging/office-ui-fabric-react-b64a72f4/lib/Foundation.js'
npm ERR! code ENOTEMPTY
npm ERR! syscall rmdir
npm ERR! path /usr/app/spfx/node_modules/.staging/typescript-950cdf73/lib/fr
npm ERR! errno -39
npm ERR! ENOTEMPTY: directory not empty, rmdir '/usr/app/spfx/node_modules/.staging/typescript-950cdf73/lib/fr'
npm ERR! A complete log of this run can be found in:
npm ERR! /home/spfx/.npm/_logs/2022-01-19T13_10_45_655Z-debug.log
directory not empty, rmdir '/usr/app/spfx/node_modules/.staging/typescript-950cdf73/lib/fr' this folder really does exist there, but I deleted the whole folder .. Maybe it's because I'm running it in Windows Powershell administrator.
Now I'm still trying to delete the node_modules folder again and run npm install directly from the CLI docker, unfortunately the speed is very slow, so I'll let you know as soon as possible.
Do I get it correctly:
- you remove
node_modulesentirely, so it is gone. - you run
npm installin Docker - it actually creates
node_modulesdirectory but outputs a lot of errors about permissions
Is that about right?
I just got a similar error with another folder / library:
verbose stack Error: ENOTEMPTY: directory not empty, rmdir '/usr/app/spfx/node_modules/.staging/@microsoft/sp-webpart-workbench-cd026fb2/local-workbench'
verbose cwd /usr/app/spfx
verbose Linux 5.10.76-linuxkit
verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "install"
verbose node v10.22.0
verbose npm v6.14.6
error code ENOTEMPTY
error syscall rmdir
error path /usr/app/spfx/node_modules/.staging/@microsoft/sp-webpart-workbench-cd026fb2/local-workbench
error errno -39
error ENOTEMPTY: directory not empty, rmdir '/usr/app/spfx/node_modules/.staging/@microsoft/sp-webpart-workbench-cd026fb2/local-workbench'
verbose exit [ -39, true ]
- Yes
- Yes
- I'm not sure if it's permission, but probably yes
I also noticed that node_modules is created, packages are loaded and extracted. At the end, only in node_modules is only the folder that ended in error (and is empty).
Could be that permissions of the project directory on your host computer does not include "Write" for "Users" group?
Permissions of the project directory on your host computer does not include "Write" for "Users" group? Yes, I added permissions and it's already working. 👍
So I still had to add -p 5432: 5432 to the docker run port I can't run a workbrench without it (in usage https://hub.docker.com/ it's missing, but on some websites it's written :).
Unfortunately, I have now tried it on my second VM on git/project folder and here again the same problem:
npm ERR! code ENOTEMPTY
npm ERR! syscall rmdir
npm ERR! path /usr/app/spfx/node_modules/.staging/@microsoft/sp-webpart-workbench-cd026fb2/local-workbench
npm ERR! errno -39
npm ERR! ENOTEMPTY: directory not empty, rmdir '/usr/app/spfx/node_modules/.staging/@microsoft/sp-webpart-workbench-cd026fb2/local-workbench'
I will try to add permissions to the root folder and possibly restart the OS ... it behaves quite randomly, but there will probably be some formula in it. At times, I find it better to write down the versions for each new project and reinstall them manually each time 😞. Anyway, thank you for the advice :)
Yes, we removed this port parameter because SPFx v.1.13.0 does not include workbench. I guess we might want to return it back to readme where we describe known issues...
Yes, we removed this port parameter because SPFx v.1.13.0 does not include workbench. I guess we might want to return it back to readme where we describe known issues...
This is a good point @shurick81: since there are older versions that do support local workbench, we should consider extending the guidance to accommodate different versions.
Unfortunately, I have to reopen this issue, I found that the problem is in the folder where I'm downloading the project from git:
So if I run: C:\git\Folder\modules\project1 npm install
I get an error:
npm ERR! code ENOTEMPTY
npm ERR! syscall rmdir
npm ERR! path /usr/app/spfx/node_modules/.staging/@microsoft/sp-webpart-workbench-cd026fb2/local-workbench
npm ERR! errno -39
npm ERR! ENOTEMPTY: directory not empty, rmdir '/usr/app/spfx/node_modules/.staging/@microsoft/sp-webpart-workbench-cd026fb2/local-workbench'
but if I create a folder:
C: \anything
and copy everything from project1
and I'll give npm install everything works as it should ...
I'm already desperate, maybe I'm doing something wrong, but I thought the whole development might work as follows, correct me if I'm wrong:
- Download "Project1" from my own server (GIT):
a) go to cd C: \ git
git clone http://server/_git/Project1 - I will go to a specific web part:
cd C:\git\Project1\modules\WebpartA - Run docker at the command prompt
docker run - Install node_modules (node_modules does not exist, because these files do not exist on git according to gitignore)
npm install - I will fill in the lines from the known issues and run
gulp serve - Ideally everything works and I can develop ...
Docker folder sharing settings Folder permission settings
Is it possible that git somehow locks files?
Should we try together with the same repo, https://github.com/shurick81/spfx1110testwp00.
git clone https://github.com/shurick81/spfx1110testwp00
cd C:\git\spfx1110testwp00\helloworld
docker run --rm -v ${pwd}:/usr/app/spfx waldekm/spfx:1.11.0 npm install
This one worked just fine for me.
I just created it via this command:
yo @microsoft/sharepoint --solution-name helloworld --component-type webpart --component-name wello-world-webpart --component-description "HelloWorld web part" --is-domain-isolated --framework none --environment spo --skip-feature-deployment false --skip-install
And don't forget to check that C:\git\spfx1110testwp00\helloworld permissions allow editing to the built in "Users" group.
This went good at first, I didn't even have to set permissions for anything (folder or docker) ... interesting, right? But the point is, it doesn't work in the git folder, but I copy the same code to another folder and then it works.
so when you clone https://github.com/shurick81/spfx1110testwp00 git repo, fix the permissions and then run npm install in docker, it does not work?
Only what i did was that i created a new folder - after i used git clone - after npm install and everything works (without any additional permisson).
@necik11, I don't get what were your actions last time, sorry.
- cd c:\git
- git clone https://github.com/shurick81/spfx1110testwp00
- create some folder? which one?
- cd C:\git\spfx1110testwp00\helloworld
- docker run --rm -v ${pwd}:/usr/app/spfx waldekm/spfx:1.11.0 npm install
Could you specify the sequence how it works for you?
- I created on c: folder github.
- Git clone
- Docker run Works well Problem is when git clone my own repository(my project) from our internally git server to folder c:\git and there try the same sequences.
I still don't get every detail but let me ask you this way then. The difference between cases when it works and does not work boils down to different git code or does it boil down to different steps (folder location, folder creation, permissions setting, etc.)
What you mean by "I created on c: folder github."?
Do I get it right that c:\git is a root folder for many different git projects on your drive?
Yes, main problem is in folder location.
cd C:
ls
Directory: C:\
Mode LastWriteTime Length Name
---- ------------- ------ ----
d----- 23.07.2021 11:19 git
d----- 23.01.2022 22:47 github
cd git ls
d----- 22.07.2021 16:14 ProjectA
d----- 15.02.2021 19:20 ProjectB
d----- 25.10.2020 19:04 ProjectC
cd ProjectA ls
d----- 21.01.2022 12:53 modules
d----- 22.07.2021 16:17 shared
-a---- 22.07.2021 16:14 955 README.md
also hidden folder (.git) cd modules ls
d----- 21.01.2022 12:53 moduleA
d----- 23.01.2022 17:11 moduleB
cd moduleA ls
d----- 21.01.2022 12:53 .vscode
d----- 21.01.2022 12:53 config
d----- 23.01.2022 19:31 node_modules (just for now-everytime delete)
d----- 21.01.2022 12:53 src
d----- 21.01.2022 12:53 teams
-a---- 21.01.2022 12:53 499 .editorconfig
-a---- 21.01.2022 12:53 358 .gitignore
-a---- 21.01.2022 12:53 322 .yo-rc.json
-a---- 21.01.2022 12:53 225 gulpfile.js
-a---- 21.01.2022 12:53 681891 npm-shrinkwrap.json
-a---- 21.01.2022 12:53 1188 package.json
-a---- 21.01.2022 12:53 2590 README.md
-a---- 21.01.2022 12:53 858 tsconfig.json
-a---- 21.01.2022 12:53 840 tslint.json
cd github (your repo)
ls
d----- 23.01.2022 22:47 spfx1110testwp00
cd spfx1110testwp00 ls
d----- 23.01.2022 23:04 helloworld
-a---- 23.01.2022 22:47 399 .yo-rc.json
-a---- 23.01.2022 22:47 20 README.md
cd helloworld
d----- 23.01.2022 22:47 .vscode
d----- 23.01.2022 22:47 config
d----- 23.01.2022 23:04 node_modules
d----- 23.01.2022 22:47 src
d----- 23.01.2022 22:47 teams
-a---- 23.01.2022 22:47 499 .editorconfig
-a---- 23.01.2022 22:47 358 .gitignore
-a---- 23.01.2022 22:47 517 .yo-rc.json
-a---- 23.01.2022 22:47 225 gulpfile.js
-a---- 23.01.2022 23:04 644711 package-lock.json
-a---- 23.01.2022 22:47 960 package.json
-a---- 23.01.2022 22:47 2590 README.md
-a---- 23.01.2022 22:47 858 tsconfig.json
-a---- 23.01.2022 22:47 840 tslint.json
Ok, so if I get it right, your experience can be described like this.
- When you clone a project to c:\git, it shows access issues when npm install
- When you clone a project to c:\githug, it woks properly
If so, please make sure that on c:\git, Users group not only has write permissions on the folder level, but also "subfolders and files":
The C:\github folder works, but it doesn't work in the snippet (c:\git) folder:
This particular screenshot with npm errors, is it taken from installing for your work repository? Could you take a screen of this when you clone https://github.com/shurick81/spfx1110testwp00 to git folder and then run npm install in docker?
It's hard to describe the error, but after running the Docker Desktop on host, everything works. Probably the success is about WSL 2.
The problem only arises when I try it on a Windows Server (VMware), where I received an error despite all the settings and permissions. It is interesting that sometimes I succeeded and it worked and the next day (after restarting the server) it did not work again ...
I tried this the same thing and my colleague and it behaved exactly the same. I will try to describe the exact procedure, I apologize in advance if the information would converge, but it is difficult to describe:
- Download the code / project (from our internal git server) git clone to the C:\git folder.
- Docker permissions settings - shared folder
- Adding permissions to the git folder for "Everyone" - "Full Control"
- Go to specific webpartA
- Run npm install - get an error
- Create a new C:\sample folder
- Copy the 1:1 webpartA from the git folder to the newly created sample folder. Again:
- Add the sample folder to the docker shared folder.
- Adding to the sample folderfor "Everyone" - "Full Control"
- Running npm install - works
The only one where the bug is probably somewhere is sharing permissions between the docker and the Windows server (VMware).
Unfortunately, I no longer have time to test why this is the case, and I will develop on the desktop ... Just if someone had the same problem and installed WSL2 on HOST, then they can't run virtualization on the VM image. Error: "Virtualized Intel VT-x / EPT is not supported on this platform."
So workaround: I need to switch host virtualization vs. VMware. Turn off: bcdedit / set hypervisorlaunchtype off Turn on: bcdedit / set hypervisorlaunchtype auto restart PC