> For the complete documentation index, see [llms.txt](https://docs.boston.gov/digital/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.boston.gov/digital/guides/drupal-8/custom-development-and-configuration/onboarding/to-be-sorted/development-environment/vscode-ide-setup.md). # VSCode IDE Setup Setting up the Visual Studio Code editor to work well with Drupal #### Add XDebug ![](https://2423273671-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVe9jGOEzVjCQBf8nyS%2F-LYXTqZxKXuom9K9TInf%2F-LYX_jtoUAFDC6Y0k4tf%2Fdebug.png?alt=media\&token=e97f2e55-f35c-4f58-8f2e-d0dcf5c25d11) 1. Under Extensions in the left sidebar, search for "PHP Debug" and click "Install" 2. Edit `.vscode/launch.json` 3. Add the following configuration: ``` { "version": "0.2.0", "configurations": [ { "name": "Listen for XDebug", "type": "php", "request": "launch", "port": 9000, "pathMappings": { "/app/": "${workspaceRoot}/", } }, { "name": "Launch currently open script", "type": "php", "request": "launch", "program": "${file}", "cwd": "${fileDirname}", "port": 9000 } ] } ``` #### Add Drupal coding standards ![](https://2423273671-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LVe9jGOEzVjCQBf8nyS%2F-LYXTqZxKXuom9K9TInf%2F-LYX_NQKTDclm2ttdVI_%2Fphpcs_drupal.png?alt=media\&token=7941c15c-dd01-4c21-9195-e5ccece71829) 1. Under Extensions in the left sidebar, search for "phpcs" and click "Install" 2. Click in top navbar navigate to `file > preferences > settings` 3. Under `Workspace Settings` expand the `Extensions` option 4. Locate `PHP CodeSniffer configuration` and scroll down to the `Standard` section and click the "Edit in settings.json" link 5. Add the following configuration to your `Workspace Settings`: ``` { "phpcs.standard": "vendor/drupal/coder/coder_sniffer/Drupal", } ```