Handling extensions
Extensions in your local VS Code are not installed by default in remote containers. You can install them from the extension explorer, or you can include them in the "devcontainer.json" file.
Install the "Prettier" extension from the Extensions Explorer view
Remove the extension
Add it via the "devcontainer.json" file
Rebuild the container
Verify that the Prettier extension is present
Open the Extensions Explorer view (Cmd/Ctrl + Shift + X)
Find "Prettier" in the "Local - Installed" extensions section. Notice that is greyed out.

Click on the "Install on Dev Container" button in the Prettier extension to install it into the Dev Container.
When the extension is finished installing, you will see a "Reload Required" on the Prettier extension page. Click it.

VS code will reload
Open the Extensions explorer view (Cmd/Ctrl + Shift + P)
Notice that the Prettier extension is now installed

Uninstall it by clicking on the "Uninstall" button on the Prettier extension page

Click on the button that says "Reload Required"

The editor is reloaded, and the Prettier extension is no longer installed
Open the "devcontainer.json" file
In the section called "extensions", add in the ID of the Prettier extension
To find this, go to the Extensions Explorer (Cmd/Ctrl + Shift + X)
Find Prettier in the "Local - Installed" section
Click on it to open the Prettier extension page

Locate the ID next to the name

Copy that value and paste it into the "devcontainer.json" file in the "extensions" section
"extensions": [
"ms-azuretools.vscode-azurefunctions",
"dbaeumer.vscode-eslint",
"esbenp.prettier-vscode"
]
Open the Command Palette (Cmd/Ctrl + Shift + P)
Select "Remote-Containers: Rebuild Container"

VS Code will reload and rebuild the container
Open the Extension Explorer view (Cmd/Ctrl + Shift + X)
Notice that the Prettier extension was installed automatically by VS Code

Last updated
Was this helpful?