spfx project devcontainer add

Usage

spfx project devcontainer add

Description

Adds the .devcontainer files for the current project

Options

Option	Description
-v, --version [version]	The version of SPFx to initialize a devcontainer for.
-g, --generator [generator]	The SPFx generator to use to initialize a devcontainer with. Allowed values: official, pnp.

Additional Info

This command would add the .devcontainer folder and the files needed to launch the project in a container. Currently, @hugoabernier has been adding these files manually to the PnP Samples repositories. We have tested webparts, but am not sure about other SPFx project types.

The command would install the files specific for the SPFx “version” and “componentType” in the yo-rc.json file.

I would love to have more conversations about this and help implement.

[DonKirkham]

All of the above are excellent suggestions.

As far as how to best get the version of SPFx, I defer to those that are more knowledgeable about how SPFx versions are tracked in a project. I always use package.json, since yo-rc.json make not have been updated. But I noticed that upgrade command always instructs that yo-rc.json be updated.

I love the idea that the spfx project upgrade command would have instructions to update the devcontainer files too. Could we also add “spfx doctor” checks to see if the devcontainer files match the SPFx version?

RE @hugoabernier’s comment about different container types. My experience so far is that Codespaces use the exact same container functionality as Docker desktop. i.e., if you can open a project in a Docker container, you can also open that github repo straight into Codespaces. (If you watch how Codespaces are named, you will see it’s the same as Docker. hmmmm

The big difference right now is that Codespaces uses the .devcontainer folder at the root of a repo only. It does not work for big monorepos, like our samples repos. Docker, however, looks for the .devcontainer of the folder loaded in the project and offers the option to rebuild the container using that configuration. An enhancement had been submitted to the Codespaces team to allow this functionality.

Thanks for everyone’s feedback and willingness to help. As I originally mentioned, I would love to help with this implementation. I have not worked with the project before, so I will definitely need some guidance.

[waldekmastykarz]

Shall we consolidate #3098 and #3460?