From de5c2c9a6e3609d559f7c2b3ef3ff7f916938e93 Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Fri, 2 Oct 2026 18:19:24 +0530 Subject: [PATCH 1/9] Monorepo tools: Add a VS Code settings installer Copies .vscode/settings.dist.jsonc to .vscode/settings.json unless the user has customized it. Written in Node so it runs on Windows without a POSIX shell. --- tools/monorepo/package.json | 1 + .../scripts/install-vscode-settings.mts | 56 +++++++++++++++++++ 2 files changed, 57 insertions(+) create mode 100644 tools/monorepo/scripts/install-vscode-settings.mts diff --git a/tools/monorepo/package.json b/tools/monorepo/package.json index cec905e725b162..49c49ba4e17522 100644 --- a/tools/monorepo/package.json +++ b/tools/monorepo/package.json @@ -38,6 +38,7 @@ "access": "public" }, "scripts": { + "install-vscode-settings": "node scripts/install-vscode-settings.mts", "list-experimental-apis": "node scripts/list-experimental-apis.mts", "wpds:admin-scheme-tokens": "node wpds/generate-admin-scheme-tokens.mjs" } diff --git a/tools/monorepo/scripts/install-vscode-settings.mts b/tools/monorepo/scripts/install-vscode-settings.mts new file mode 100644 index 00000000000000..f013b8ae0eff22 --- /dev/null +++ b/tools/monorepo/scripts/install-vscode-settings.mts @@ -0,0 +1,56 @@ +/** + * Install repo-recommended VS Code settings. + * + * Cross-platform replacement for a shell script: invoked from `.vscode/tasks.json` + * on folder open. Runs on Windows, macOS, and Linux without a POSIX shell. + * + * Exit codes: + * 0: All is well (or user has custom settings we shouldn't touch) + * 1: Repo settings template is missing + * 2: Settings file creation failed + */ + +import { readFileSync, copyFileSync, existsSync } from 'node:fs'; +import path from 'node:path'; +import { fileURLToPath } from 'node:url'; + +const REPO_ROOT = path.resolve( + path.dirname( fileURLToPath( import.meta.url ) ), + '../../..' +); +const templateFile = path.join( REPO_ROOT, '.vscode', 'settings.dist.jsonc' ); +const destFile = path.join( REPO_ROOT, '.vscode', 'settings.json' ); +const managedComment = '// This is a managed VS Code settings file.'; + +if ( ! existsSync( templateFile ) ) { + console.error( 'Repo settings template is missing; aborting.' ); + process.exit( 1 ); +} + +const template = readFileSync( templateFile, 'utf8' ); + +if ( existsSync( destFile ) ) { + const current = readFileSync( destFile, 'utf8' ); + if ( current === template ) { + console.log( 'Managed settings are up to date; no changes needed.' ); + process.exit( 0 ); + } + if ( ! current.startsWith( managedComment ) ) { + console.log( 'Custom settings file; aborting.' ); + process.exit( 0 ); + } +} + +try { + copyFileSync( templateFile, destFile ); +} catch ( err ) { + console.error( 'Error copying settings into place!', err ); + process.exit( 2 ); +} + +if ( readFileSync( destFile, 'utf8' ) !== template ) { + console.error( 'Error copying settings into place!' ); + process.exit( 2 ); +} + +console.log( 'Copied managed settings into place.' ); From 18a73f1e157ccedc48c0ad93a704478d29c36a50 Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Fri, 2 Oct 2026 18:19:30 +0530 Subject: [PATCH 2/9] VS Code: Add managed workspace config Adds recommended extensions, a managed settings template, and a folder-open task that runs the installer. The template points the TypeScript, ESLint, Prettier and Stylelint extensions at the workspaces that declare them, since the isolated install layout keeps those dependencies out of the root node_modules. --- .gitignore | 1 + .vscode/extensions.json | 17 ++++++++ .vscode/settings.dist.jsonc | 80 +++++++++++++++++++++++++++++++++++++ .vscode/tasks.json | 26 ++++++++++++ 4 files changed, 124 insertions(+) create mode 100644 .vscode/extensions.json create mode 100644 .vscode/settings.dist.jsonc create mode 100644 .vscode/tasks.json diff --git a/.gitignore b/.gitignore index 140ec956b0cbbc..15de83d5b7d3dc 100644 --- a/.gitignore +++ b/.gitignore @@ -59,6 +59,7 @@ phpcs.xml phpunit.xml phpunit-watcher.yml .tool-versions +/.vscode/settings.json test/storybook-playwright/test-results test/storybook-playwright/specs/__snapshots__ test/storybook-playwright/specs/*-snapshots/** diff --git a/.vscode/extensions.json b/.vscode/extensions.json new file mode 100644 index 00000000000000..4a47fa4088a99f --- /dev/null +++ b/.vscode/extensions.json @@ -0,0 +1,17 @@ +{ + /** + * List of recommended extensions to use for this workspace. + * The identifier of an extension is always `${publisher}.${name}`, + * which is a part of the URL, e.g. https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint + * You can view these extensions using the command `Extensions: Show Recommended Extensions`. + */ + "recommendations": [ + "editorconfig.editorconfig", // EditorConfig + "bmewburn.vscode-intelephense-client", // PHP Intelephense + "dbaeumer.vscode-eslint", // ESLint + "esbenp.prettier-vscode", // Prettier - Code formatter + "obliviousharmony.vscode-php-codesniffer", // PHP_CodeSniffer + "stylelint.vscode-stylelint", // Stylelint + "TypeScriptTeam.native-preview" // Native TypeScript preview + ] +} diff --git a/.vscode/settings.dist.jsonc b/.vscode/settings.dist.jsonc new file mode 100644 index 00000000000000..8cc8f9f56c2a04 --- /dev/null +++ b/.vscode/settings.dist.jsonc @@ -0,0 +1,80 @@ +// This is a managed VS Code settings file. +// It is copied into place by `tools/monorepo/scripts/install-vscode-settings.mts`. +// If you no longer want the settings managed, remove these comments. +{ + // Define schema to allow auto-completion. + "$schema": "vscode://schemas/settings/workspace", + // Don't show these files in VS Code. + "files.exclude": { + "**/.DS_Store/**": true, + }, + // Don't search these files in VS Code. + "search.exclude": { + "**/.cache/**": true, + "**/build/**": true, + "**/build-module/**": true, + "**/build-types/**": true, + "**/build-style/**": true, + "**/node_modules/**": true, + "**/vendor/**": true, + }, + // Use TypeScript from the workspace instead of VS Code's built-in TypeScript version. + "js/ts.tsdk.path": "tools/build-scripts/node_modules/@typescript/native/lib", + // Use Native TypeScript. + "js/ts.experimental.useTsgo": true, + // Use ESLint, Prettier and Stylelint from the workspaces that declare them. + "eslint.nodePath": "tools/eslint/node_modules", + "prettier.prettierPath": "packages/prettier-config/node_modules/prettier", + "stylelint.stylelintPath": "tools/stylelint/node_modules/stylelint", + // Show suppressed ESLint violations as hints. + "eslint.bulkSuppression.enable": true, + "eslint.bulkSuppression.location": "tools/eslint/suppressions.json", + "eslint.bulkSuppression.severity": "hint", + // Custom settings for PHP files. + "[php]": { + // Ensure that PHP files are formatted with PHPCS. + "editor.formatOnSave": true, + "editor.defaultFormatter": "obliviousharmony.vscode-php-codesniffer", + }, + "intelephense.environment.phpVersion": "7.4.0", + // Don't run Intelephense on these files. + "intelephense.files.exclude": [ + "**/.cache/**", + "**/.git/**", + "**/.history/**", + "**/build/**", + "**/build-module/**", + "**/build-types/**", + "**/build-style/**", + "**/node_modules/**", + "**/vendor/**", + ], + "phpCodeSniffer.autoExecutable": true, + "phpCodeSniffer.standard": "Automatic", + // Have PHPCS ignore these files. + "phpCodeSniffer.exclude": [ + "**/.git/**", + "**/.svn/**", + "**/.hg/**", + "**/.cache/**", + "**/build/**", + "**/node_modules/**", + "**/vendor/**", + ], + // Custom settings for JavaScript and TypeScript files. + "[javascript][javascriptreact][typescript][typescriptreact]": { + "editor.formatOnSave": false, + "editor.defaultFormatter": "esbenp.prettier-vscode", + }, + // Run Code Actions for the editor. + "editor.codeActionsOnSave": { + "source.fixAll.eslint": "explicit", + "source.fixAll.stylelint": "explicit", + }, + // Custom settings for CSS, SCSS, and SASS files. + "[css][scss][sass]": { + "editor.formatOnSave": false, + "editor.defaultFormatter": "stylelint.vscode-stylelint", + }, + "stylelint.validate": [ "css", "postcss", "scss" ], +} diff --git a/.vscode/tasks.json b/.vscode/tasks.json new file mode 100644 index 00000000000000..c4a886edba56cf --- /dev/null +++ b/.vscode/tasks.json @@ -0,0 +1,26 @@ +{ + // See https://go.microsoft.com/fwlink/?LinkId=733558 + // for the documentation about the tasks.json format + "version": "2.0.0", + "tasks": [ + { + "label": "Install VS Code settings", + "type": "shell", + "command": "npm", + "args": [ + "run", + "install-vscode-settings", + "--workspace", + "@wordpress/monorepo-tools" + ], + "runOptions": { + "runOn": "folderOpen" + }, + "problemMatcher": [], + "presentation": { + "reveal": "silent", + "close": true + } + } + ] +} From 06347fc22cb8eb79419cb5cf8816d576dc9b4962 Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Fri, 2 Oct 2026 18:19:31 +0530 Subject: [PATCH 3/9] Docs: Point to the managed VS Code workspace settings Replaces the copyable settings snippet with a description of the managed config, so the settings live in one place. --- .../getting-started-with-code-contribution.md | 82 ++----------------- 1 file changed, 5 insertions(+), 77 deletions(-) diff --git a/docs/contributors/code/getting-started-with-code-contribution.md b/docs/contributors/code/getting-started-with-code-contribution.md index e870fd5498ef72..572ffa8127c449 100644 --- a/docs/contributors/code/getting-started-with-code-contribution.md +++ b/docs/contributors/code/getting-started-with-code-contribution.md @@ -216,83 +216,11 @@ We recommend configuring your editor to automatically check for syntax and lint ### Visual Studio Code -If you use Visual Studio Code, the following extensions and workspace settings can help the editor use the same linting, formatting, PHP, and TypeScript tooling as the Gutenberg repository. These settings are optional and should live in your local `.vscode/settings.json` file. Do not commit your personal workspace settings; add `.vscode/settings.json` to your [global gitignore file](https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files#configuring-ignored-files-for-all-repositories-on-your-computer) if needed. - -Recommended extensions: - -- [EditorConfig for VS Code](https://marketplace.visualstudio.com/items?itemName=editorconfig.editorconfig) -- [PHP Intelephense](https://marketplace.visualstudio.com/items?itemName=bmewburn.vscode-intelephense-client) -- [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint) -- [Prettier - Code formatter](https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode) -- [PHP_CodeSniffer](https://marketplace.visualstudio.com/items?itemName=obliviousharmony.vscode-php-codesniffer) -- [Stylelint](https://marketplace.visualstudio.com/items?itemName=stylelint.vscode-stylelint) -- [Native TypeScript Preview](https://marketplace.visualstudio.com/items?itemName=TypeScriptTeam.native-preview) - -You can start with this workspace settings file: - -```jsonc -{ - "search.exclude": { - "**/.cache/**": true, - "**/build/**": true, - "**/build-module/**": true, - "**/build-types/**": true, - "**/build-style/**": true, - "**/node_modules/**": true, - "**/vendor/**": true - }, - // Use TypeScript from the workspace instead of VS Code's built-in TypeScript version. - "js/ts.tsdk.path": "tools/build-scripts/node_modules/@typescript/native/lib", - // Use ESLint, Prettier and Stylelint from the respective paths. - "eslint.nodePath": "tools/eslint/node_modules", - "prettier.prettierPath": "packages/prettier-config/node_modules/prettier", - "stylelint.stylelintPath": "tools/stylelint/node_modules/stylelint", - "[php]": { - "editor.formatOnSave": true, - "editor.defaultFormatter": "obliviousharmony.vscode-php-codesniffer" - }, - "eslint.bulkSuppression.enable": true, - "eslint.bulkSuppression.location": "tools/eslint/suppressions.json", - "eslint.bulkSuppression.severity": "hint", - "intelephense.environment.phpVersion": "7.4.0", - "intelephense.files.exclude": [ - "**/.cache/**", - "**/.git/**", - "**/.history/**", - "**/build/**", - "**/build-module/**", - "**/build-types/**", - "**/build-style/**", - "**/node_modules/**", - "**/vendor/**" - ], - "phpCodeSniffer.autoExecutable": true, - "phpCodeSniffer.standard": "Automatic", - "phpCodeSniffer.exclude": [ - "**/.git/**", - "**/.svn/**", - "**/.hg/**", - "**/.cache/**", - "**/build/**", - "**/node_modules/**", - "**/vendor/**" - ], - "[javascript][javascriptreact][typescript][typescriptreact]": { - "editor.formatOnSave": false, - "editor.defaultFormatter": "esbenp.prettier-vscode" - }, - "editor.codeActionsOnSave": { - "source.fixAll.eslint": "explicit", - "source.fixAll.stylelint": "explicit" - }, - "[css][scss][sass]": { - "editor.formatOnSave": false, - "editor.defaultFormatter": "stylelint.vscode-stylelint" - }, - "stylelint.validate": [ "css", "postcss", "scss" ], - "js/ts.experimental.useTsgo": true -} -``` +If you use Visual Studio Code, the repository ships a managed workspace configuration so the editor uses the same linting, formatting, PHP, and TypeScript tooling as the Gutenberg repository. The first time you open the folder, VS Code prompts you to install the [recommended extensions](https://github.com/WordPress/gutenberg/blob/HEAD/.vscode/extensions.json) and to allow an automatic task that copies [`.vscode/settings.dist.jsonc`](https://github.com/WordPress/gutenberg/blob/HEAD/.vscode/settings.dist.jsonc) to `.vscode/settings.json`. Allow both and you're set up. + +The installer does not overwrite a `settings.json` you have customized. To stop it managing yours, remove the comments at the top of the file. You can re-run it at any time from the Command Palette via **Tasks: Run Task → Install VS Code settings**. + +The settings point the TypeScript, ESLint, Prettier, and Stylelint extensions at the workspaces that install them, because those tools are not installed in the root `node_modules`. If you maintain your own settings, copy those paths from the template. ### EditorConfig From 12235810641a0966bca10389b6b2df7f04126481 Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Fri, 2 Oct 2026 18:40:51 +0530 Subject: [PATCH 4/9] Docs: Clarify when the VS Code settings installer overwrites The installer replaces any settings.json that still carries the managed header, so edits kept under it are lost on the next folder open. --- .../contributors/code/getting-started-with-code-contribution.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/contributors/code/getting-started-with-code-contribution.md b/docs/contributors/code/getting-started-with-code-contribution.md index 572ffa8127c449..ba18b76ece993a 100644 --- a/docs/contributors/code/getting-started-with-code-contribution.md +++ b/docs/contributors/code/getting-started-with-code-contribution.md @@ -218,7 +218,7 @@ We recommend configuring your editor to automatically check for syntax and lint If you use Visual Studio Code, the repository ships a managed workspace configuration so the editor uses the same linting, formatting, PHP, and TypeScript tooling as the Gutenberg repository. The first time you open the folder, VS Code prompts you to install the [recommended extensions](https://github.com/WordPress/gutenberg/blob/HEAD/.vscode/extensions.json) and to allow an automatic task that copies [`.vscode/settings.dist.jsonc`](https://github.com/WordPress/gutenberg/blob/HEAD/.vscode/settings.dist.jsonc) to `.vscode/settings.json`. Allow both and you're set up. -The installer does not overwrite a `settings.json` you have customized. To stop it managing yours, remove the comments at the top of the file. You can re-run it at any time from the Command Palette via **Tasks: Run Task → Install VS Code settings**. +The installer replaces `settings.json` whenever it still starts with the managed comments, so edits made there are lost when the template changes. To keep your own settings, remove those comments; the installer then leaves the file alone. You can re-run it at any time from the Command Palette via **Tasks: Run Task → Install VS Code settings**. The settings point the TypeScript, ESLint, Prettier, and Stylelint extensions at the workspaces that install them, because those tools are not installed in the root `node_modules`. If you maintain your own settings, copy those paths from the template. From 38dc766e40b5b0ee3f7a4bc11b48f0d4d13f22a2 Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Fri, 2 Oct 2026 18:40:52 +0530 Subject: [PATCH 5/9] Monorepo tools: Document the VS Code settings installer --- tools/monorepo/README.md | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/tools/monorepo/README.md b/tools/monorepo/README.md index c1229407dab116..045474478fdebd 100644 --- a/tools/monorepo/README.md +++ b/tools/monorepo/README.md @@ -29,6 +29,10 @@ See the TypeScript section of [`packages/README.md`](../../packages/README.md) f `npm run --workspace @wordpress/monorepo-tools list-experimental-apis` prints a Markdown list of every `__experimental` API in `packages/` and `lib/`, each linked to a GitHub search for it. Release leads run it to audit experimental APIs ahead of a major WordPress release, as in [the WordPress 6.2 audit](https://github.com/WordPress/gutenberg/issues/47196). +## VS Code settings + +`npm run --workspace @wordpress/monorepo-tools install-vscode-settings` copies `.vscode/settings.dist.jsonc` to `.vscode/settings.json`, unless that file no longer starts with the managed comments. A VS Code task runs it when the folder opens. + ## Admin design tokens experiment `wpds/generate-admin-scheme-tokens.mjs` writes the per-colour-scheme design token stylesheet for the admin design tokens experiment, `lib/experimental/wpds-admin/css/05-scheme-tokens.css`. Run it with `npm run wpds:admin-scheme-tokens --workspace @wordpress/monorepo-tools` after changing the theme's colour ramps or the admin colour schemes. It is temporary; the generated file's header says what replaces it. From 236485ea56c2878b427fba9ed853a1726ce97d40 Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Fri, 2 Oct 2026 18:42:07 +0530 Subject: [PATCH 6/9] VS Code: Drop the Native TypeScript preview recommendation VS Code runs Native TypeScript itself through js/ts.experimental.useTsgo, so the preview extension is no longer needed. --- .vscode/extensions.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/.vscode/extensions.json b/.vscode/extensions.json index 4a47fa4088a99f..d04a7ac1b51be2 100644 --- a/.vscode/extensions.json +++ b/.vscode/extensions.json @@ -11,7 +11,6 @@ "dbaeumer.vscode-eslint", // ESLint "esbenp.prettier-vscode", // Prettier - Code formatter "obliviousharmony.vscode-php-codesniffer", // PHP_CodeSniffer - "stylelint.vscode-stylelint", // Stylelint - "TypeScriptTeam.native-preview" // Native TypeScript preview + "stylelint.vscode-stylelint" // Stylelint ] } From 23261a4549740be805615e95892b34a1b8691e71 Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Sat, 3 Oct 2026 09:48:18 +0530 Subject: [PATCH 7/9] Revert "VS Code: Drop the Native TypeScript preview recommendation" This reverts commit fef028e7195. VS Code 1.140.0 still bundles TypeScript 6, so Native TypeScript needs the extension: https://github.com/microsoft/TypeScript/issues/64565 --- .vscode/extensions.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.vscode/extensions.json b/.vscode/extensions.json index d04a7ac1b51be2..4a47fa4088a99f 100644 --- a/.vscode/extensions.json +++ b/.vscode/extensions.json @@ -11,6 +11,7 @@ "dbaeumer.vscode-eslint", // ESLint "esbenp.prettier-vscode", // Prettier - Code formatter "obliviousharmony.vscode-php-codesniffer", // PHP_CodeSniffer - "stylelint.vscode-stylelint" // Stylelint + "stylelint.vscode-stylelint", // Stylelint + "TypeScriptTeam.native-preview" // Native TypeScript preview ] } From 21bb2f5fe5b4f7988e1989dcde336828b162a326 Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Mon, 5 Oct 2026 15:23:47 +0530 Subject: [PATCH 8/9] VS Code: Name the line that keeps settings managed The installer only checks the first line, but the header, docs and README said to remove "the managed comments" without saying which. --- .vscode/settings.dist.jsonc | 4 ++-- .../code/getting-started-with-code-contribution.md | 2 +- tools/monorepo/README.md | 2 +- 3 files changed, 4 insertions(+), 4 deletions(-) diff --git a/.vscode/settings.dist.jsonc b/.vscode/settings.dist.jsonc index 8cc8f9f56c2a04..18bf3030551795 100644 --- a/.vscode/settings.dist.jsonc +++ b/.vscode/settings.dist.jsonc @@ -1,6 +1,6 @@ // This is a managed VS Code settings file. -// It is copied into place by `tools/monorepo/scripts/install-vscode-settings.mts`. -// If you no longer want the settings managed, remove these comments. +// While the first line is present, opening the folder replaces this file with `.vscode/settings.dist.jsonc`. +// To customize these settings and keep your changes, delete the first line. { // Define schema to allow auto-completion. "$schema": "vscode://schemas/settings/workspace", diff --git a/docs/contributors/code/getting-started-with-code-contribution.md b/docs/contributors/code/getting-started-with-code-contribution.md index ba18b76ece993a..30b9ed7fae8bbf 100644 --- a/docs/contributors/code/getting-started-with-code-contribution.md +++ b/docs/contributors/code/getting-started-with-code-contribution.md @@ -218,7 +218,7 @@ We recommend configuring your editor to automatically check for syntax and lint If you use Visual Studio Code, the repository ships a managed workspace configuration so the editor uses the same linting, formatting, PHP, and TypeScript tooling as the Gutenberg repository. The first time you open the folder, VS Code prompts you to install the [recommended extensions](https://github.com/WordPress/gutenberg/blob/HEAD/.vscode/extensions.json) and to allow an automatic task that copies [`.vscode/settings.dist.jsonc`](https://github.com/WordPress/gutenberg/blob/HEAD/.vscode/settings.dist.jsonc) to `.vscode/settings.json`. Allow both and you're set up. -The installer replaces `settings.json` whenever it still starts with the managed comments, so edits made there are lost when the template changes. To keep your own settings, remove those comments; the installer then leaves the file alone. You can re-run it at any time from the Command Palette via **Tasks: Run Task → Install VS Code settings**. +The installer replaces `settings.json` whenever its first line is `// This is a managed VS Code settings file.`, so edits made there are lost when the template changes. To keep your own settings, delete that line; the installer then leaves the file alone. You can re-run it at any time from the Command Palette via **Tasks: Run Task → Install VS Code settings**. The settings point the TypeScript, ESLint, Prettier, and Stylelint extensions at the workspaces that install them, because those tools are not installed in the root `node_modules`. If you maintain your own settings, copy those paths from the template. diff --git a/tools/monorepo/README.md b/tools/monorepo/README.md index 045474478fdebd..174d327e48ae93 100644 --- a/tools/monorepo/README.md +++ b/tools/monorepo/README.md @@ -31,7 +31,7 @@ See the TypeScript section of [`packages/README.md`](../../packages/README.md) f ## VS Code settings -`npm run --workspace @wordpress/monorepo-tools install-vscode-settings` copies `.vscode/settings.dist.jsonc` to `.vscode/settings.json`, unless that file no longer starts with the managed comments. A VS Code task runs it when the folder opens. +`npm run --workspace @wordpress/monorepo-tools install-vscode-settings` copies `.vscode/settings.dist.jsonc` to `.vscode/settings.json`, unless that file no longer starts with `// This is a managed VS Code settings file.` A VS Code task runs it when the folder opens. ## Admin design tokens experiment From 9bbfac258adfbcbc739d2ae34d9dac09c823c8b8 Mon Sep 17 00:00:00 2001 From: Manzoor Wani Date: Tue, 6 Oct 2026 16:57:17 +0530 Subject: [PATCH 9/9] Docs: Mention the TypeScript 7 workspace tsdk prompt The extension ignores a workspace js/ts.tsdk.path until the user allows it, and managed settings are replaced on every folder open, not only when the template changes. --- .../code/getting-started-with-code-contribution.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/contributors/code/getting-started-with-code-contribution.md b/docs/contributors/code/getting-started-with-code-contribution.md index 30b9ed7fae8bbf..b88f375db8d927 100644 --- a/docs/contributors/code/getting-started-with-code-contribution.md +++ b/docs/contributors/code/getting-started-with-code-contribution.md @@ -216,9 +216,9 @@ We recommend configuring your editor to automatically check for syntax and lint ### Visual Studio Code -If you use Visual Studio Code, the repository ships a managed workspace configuration so the editor uses the same linting, formatting, PHP, and TypeScript tooling as the Gutenberg repository. The first time you open the folder, VS Code prompts you to install the [recommended extensions](https://github.com/WordPress/gutenberg/blob/HEAD/.vscode/extensions.json) and to allow an automatic task that copies [`.vscode/settings.dist.jsonc`](https://github.com/WordPress/gutenberg/blob/HEAD/.vscode/settings.dist.jsonc) to `.vscode/settings.json`. Allow both and you're set up. +If you use Visual Studio Code, the repository ships a managed workspace configuration so the editor uses the same linting, formatting, PHP, and TypeScript tooling as the Gutenberg repository. The first time you open the folder, VS Code prompts you to install the [recommended extensions](https://github.com/WordPress/gutenberg/blob/HEAD/.vscode/extensions.json) and to allow an automatic task that copies [`.vscode/settings.dist.jsonc`](https://github.com/WordPress/gutenberg/blob/HEAD/.vscode/settings.dist.jsonc) to `.vscode/settings.json`. Allow both. When the TypeScript 7 extension then asks whether to use the TypeScript 7 tsdk this workspace configures, choose **Allow**; otherwise it keeps using its bundled version. -The installer replaces `settings.json` whenever its first line is `// This is a managed VS Code settings file.`, so edits made there are lost when the template changes. To keep your own settings, delete that line; the installer then leaves the file alone. You can re-run it at any time from the Command Palette via **Tasks: Run Task → Install VS Code settings**. +The installer replaces `settings.json` whenever its first line is `// This is a managed VS Code settings file.`, so edits made there are lost the next time the folder opens or the installer runs. To keep your own settings, delete that line; the installer then leaves the file alone. You can re-run it at any time from the Command Palette via **Tasks: Run Task → Install VS Code settings**. The settings point the TypeScript, ESLint, Prettier, and Stylelint extensions at the workspaces that install them, because those tools are not installed in the root `node_modules`. If you maintain your own settings, copy those paths from the template.