--- title: "Discussion on \"How Docker containers eliminate SPFx environment setup\" | Hashnode" description: "Discussion on \"How Docker containers eliminate SPFx environment setup\". Serve multiple SPFx/Node.js versions on one environment without installation" url: "https://hashnode.com/posts/how-docker-containers-eliminate-spfx-environment-setup/620fc2628f26523301cb51df" --- [Feed](https://hashnode.com/feed) / Discussion # [How Docker containers eliminate SPFx environment setup](https://spfx-app.dev/how-docker-containers-eliminate-spfx-environment-setup?utm_source=hashnode&utm_medium=feed) Serve multiple SPFx/Node.js versions on one environment without installation Feb 18, 2022 · 8 min read · spfx-app.dev Updated Sep 7, 2023 Read the article - [#docker](https://hashnode.com/tag/docker) - [#microsoft](https://hashnode.com/tag/microsoft) ## Written by [$€®¥09@](https://hashnode.com/@Seryoga) @Seryoga · Nuremberg, Germany [View profile](https://hashnode.com/@Seryoga) Software Architect I am Sergej and I am a Software Architect from Germany (AURUM GmbH). I have been developing on Microsoft technologies for more than 14 years, especially in SharePoint / Microsoft 365. With this blog, I want to share my knowledge with you and also improve my English skills. The posts are not only about SPFx (SharePoint Framework) but also about tips & tricks around the M365 world & developments of all kinds. The posts are about TypeScript, C#, Node.js, Vue.js, Visual Studio/ VS Code, Quasar, PowerShell, and much more. I hope you will find some interesting posts. I would also be happy if you follow me. Greetings from Germany Sergej / $€®¥09@ ## Responses 2 Markdown supported · ⌘↵ to post [János Nagy](https://hashnode.com/@Yanitzar) [Oct 20, 2022](https://hashnode.com/posts/how-docker-containers-eliminate-spfx-environment-setup/620fc2628f26523301cb51df/comment/6351039bb58387b1b77250cf) Hi! Thanks for the great article. I tried but ultimately failed to convert your solution to SharePoint 2019 on-premises. Should you have time, could you publish a docker file that works with SPFx 1.4.1 and includes the fast serve package? Thanks a lot! [$€®¥09@](https://hashnode.com/@Seryoga) [Oct 21, 2022](https://hashnode.com/posts/how-docker-containers-eliminate-spfx-environment-setup/620fc2628f26523301cb51df/comment/6351039bb58387b1b77250cf#reply-6352745a4143cfc299771cde) Hi [János Nagy](https://hashnode.com/@Yanitzar) thank you for the comment. Yesterday I wanted to (quickly) deploy SPFx version 1.12.1 (last version supporting SP2019) as a Docker image and as alpine version. Unfortunately, there were some problems with the permissions, so that an `npm i` resulted in errors. When I have a bit more time, I will take a closer look. In the meantime, you can use the official Docker image version 1.12.1 (`docker pull m365pnp/spfx:1.12.1`) and install spfx-fast-serve manually (or modify the Dockerfile and add spfx-fast-serve). For example: ``` FROM node:14.17.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 USER spfx RUN npm i -g gulp@4 yo @microsoft/generator-sharepoint@1.12.1 spfx-fast-serve CMD /bin/bash ``` [Franck Silvestre](https://hashnode.com/@frncks) [Aug 29, 2022](https://hashnode.com/posts/how-docker-containers-eliminate-spfx-environment-setup/620fc2628f26523301cb51df/comment/630d2c0743d7308e3e3287c6) Hi Sergej, Thanks a lot for your article as it helped me fix several issues I've been struggling with for hours when trying to use to the 'docker image for SPFx 1.15.0' (https--hub.docker.com/r/m365pnp/spfx/) on Windows 10. As I'm new to docker (with WSL 2), I had a **first issue** (not mentioned in your article) to copy and install the trusted dev certificate: - It is generated via 'gulp trust-dev-cert' but, since the command is run in the container, it's not generated under '/usr/app/spfx' but as '/home/spfx/.rushstack/rushstack-serve.pem' file! - Therefore, to be able to install it on your host (Win10 cert store), it has to be converted as .cer file and copied first to the /usr/app/spfx' folder (which is mapped to the SPFx project folder in Win10) using the following command: openssl x509 -inform PEM -in ~/.rushstack/rushstack-serve.pem -outform DER -out ./spfx-dev-cert-docker.cer - Once accessible from the project folder in Win10, import it into the user's Trusted Root Certification Authorities store. But that was not enough as I bumped into the **2nd issue** dealing with the web part not available in the workbench (same problem as you mentioned in your article). Although that's a known issue with >=1.14.0 as reported on the 'docker m365pnp/spfx page' (https--hub.docker.com/r/m365pnp/spfx/), the proposed fix simply doesn't work (the _ipAddress_ attribute does not exist)! After many tryouts, both fixes for 1.13.1 still applies: - add _"hostname": "0.0.0.0"_ in serve.json - modifiy node\_modules\\@microsoft\\spfx-heft-plugins\\lib\\plugins\\webpackConfigurationPlugin\\WebpackConfigurationGenerator.js:408 (and not line 393) After these changes, the web part appears and run correctly in the workbench. Note: sorry for the links but I could not include any url in my comment (as I'm new Hashnode user) :-( [$€®¥09@](https://hashnode.com/@Seryoga) [Sep 16, 2022](https://hashnode.com/posts/how-docker-containers-eliminate-spfx-environment-setup/620fc2628f26523301cb51df/comment/630d2c0743d7308e3e3287c6#reply-63245df0bc15ea8efdf5d2ca) Hey [Franck Silvestre](https://hashnode.com/@frncks) thank you for the comment and sorry for the late reply. I actually didn't look at how to get the certificate "trusted". For me, it was easier to go to the localhost URL and then manually click on the "trust" button (as described in the blog). Can you tell me if your solution is a permanent one or if you have to do it every time you create a new container/new project? I assume that you have to do it every time. If it is a temporal solution, then the "manual trust" is the faster solution, in my opinion. Did I understand you correctly that under >=1.14.0 you always have to adjust the file `node_modules\@microsoft\sp-build-web\node_modules\@microsoft\spfx-heft-plugins\lib\plugins\webpackConfigurationPlugin\WebpackConfigurationGenerator.js`? If so, you don't have to. `ipAddress`\-Property is just not in the schema definition, but it works. I have already used this in some projects. So you can ignore the warning in the IDE. Just out of interest, are you using the original image or mine? EDIT: Funny coincidence: I'm looking at how to get SPFx working with nvm and found an article that also describes your way regarding the certificate. EDIT 2: I have just tried it out. If you create a new container for the project that already has the certificate installed, you don't have to do anything. However, if you create a new project, you have to install the certificate again. Very sad.