blob: e0ca28aaaa25edd75140aa6812ca326f6c3b10c3 [file] [log] [blame] [view]
ljustene262c842017-04-12 08:29:041# Visual Studio Code Dev
2
Ming-Ying Chunga7db9dde82022-07-12 06:31:543**Get started [here](#setup)**.
4
Tiago Vignatti3e5b18bc2023-03-30 13:13:465[Visual Studio Code (VS Code)](https://code.visualstudio.com) is a free, open
6source, lightweight and powerful code editor for Windows, macOS and Linux, based
7on [Electron](https://www.electronjs.org/)/Chromium. It has built-in support for
8JavaScript, TypeScript and Node.js and a rich extension ecosystem that adds
9intellisense, debugging, syntax highlighting etc. For many languages like C++,
10Python, Go, Java, it works without too much setup.
ljustene262c842017-04-12 08:29:0411
12It is NOT a full-fledged IDE like Visual Studio. The two are completely
13separate products. The only commonality with Visual Studio is that both are
14from Microsoft.
15
16Here's what works well:
17
Ming-Ying Chunga7db9dde82022-07-12 06:31:5418* **Editing code** works well especially when you get used to the [keyboard
19 shortcuts](#Keyboard-Shortcuts). VS Code is very responsive and can handle
20 even big code bases like Chromium.
21* **Git integration** is a blast. Built-in side-by-side view, local commit and
ljustene262c842017-04-12 08:29:0422 even extensions for
23 [history](https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory)
24 and
25 [blame view](https://marketplace.visualstudio.com/items?itemName=ryu1kn.annotator).
Ming-Ying Chunga7db9dde82022-07-12 06:31:5426* [**Debugging**](https://code.visualstudio.com/Docs/editor/debugging) works
ljustene262c842017-04-12 08:29:0427 well, even though startup times can be fairly high (~40 seconds with
28 gdb on Linux, much lower on Windows). You can step through code, inspect
29 variables, view call stacks for multiple threads etc.
Ryan Heise9a711432020-10-14 23:55:3930 * For more information on debugging Python code, see [here](vscode_python.md).
Ming-Ying Chunga7db9dde82022-07-12 06:31:5431* **Command Palette** makes opening files and searching solution really easy.
32* **Building** works well. Build tools are easy to integrate. Warnings and errors
ljustene262c842017-04-12 08:29:0433 are displayed on a separate page and you can click to jump to the
34 corresponding line of code.
Ming-Ying Chunga7db9dde82022-07-12 06:31:5435* **VS Code Remote**, which allows you to edit remotely-hosted code, and even
36 run computationally expensive plugins like vscode-clangd on the remote
37 server. Great for working from home. See the [Remote section](#Remote) for
38 more details.
chaopengba312ce2017-02-12 03:38:2539
chaopengca285112017-03-02 15:39:0440[TOC]
41
Ming-Ying Chunga7db9dde82022-07-12 06:31:5442
ljustene262c842017-04-12 08:29:0443## Updating This Page
chaopengba312ce2017-02-12 03:38:2544
ljustene262c842017-04-12 08:29:0445Please keep this doc up-to-date. VS Code is still in active development and
46subject to changes. This doc is checked into the Chromium git repo, so if you
47make changes, read the [documentation
Ming-Ying Chunga7db9dde82022-07-12 06:31:5448guidelines](documentation_guidelines.md) and
49[submit a change list](contributing.md).
chaopengba312ce2017-02-12 03:38:2550
Tiago Vignatti3e5b18bc2023-03-30 13:13:4651All file paths and commands have been tested on Linux and macOS. Windows might
52require a slightly different setup. Please update this page accordingly.
chaopengba312ce2017-02-12 03:38:2553
Ming-Ying Chunga7db9dde82022-07-12 06:31:5454
ljustene262c842017-04-12 08:29:0455## Setup
chaopengba312ce2017-02-12 03:38:2556
ljustene262c842017-04-12 08:29:0457### Installation
chaopengba312ce2017-02-12 03:38:2558
Ming-Ying Chunga7db9dde82022-07-12 06:31:5459*** promo
Ming-Ying Chung8dadf3f32024-03-12 18:47:2760Googlers: See [go/vscode/install](http://go/vscode/install) instead.
Ming-Ying Chunga7db9dde82022-07-12 06:31:5461***
62
Ming-Ying Chung8dadf3f32024-03-12 18:47:2763Follow the steps on [Setting up Visual Studio Code][setup] to install a proper
64version for you development platform.
65
66[setup]: https://code.visualstudio.com/docs/setup/setup-overview
Ming-Ying Chunga7db9dde82022-07-12 06:31:5467
68### Usage
69
Ming-Ying Chung8dadf3f32024-03-12 18:47:2770To run it on Linux or on macOS:
71
72```bash
73cd /path/to/chromium/src
74code .
75```
chaopengba312ce2017-02-12 03:38:2576
Daniel Cheng2d4c2d192022-07-01 01:38:3177If you installed Code Insiders, the binary name is `code-insiders` instead.
78
Ming-Ying Chung8dadf3f32024-03-12 18:47:2779Note that VS Code does not require project or solution files. However, it does
80store workspace settings in a `.vscode` folder in your base directory (i.e. your
81project root folder). See the [Chromium Workspace Settings](#setup-for-chromium)
82section for details.
Daniel Cheng2d4c2d192022-07-01 01:38:3183
ljustene262c842017-04-12 08:29:0484### Useful Extensions
chaopengba312ce2017-02-12 03:38:2585
ljustene262c842017-04-12 08:29:0486Up to now, you have a basic version of VS Code without much language support.
Ming-Ying Chung8dadf3f32024-03-12 18:47:2787Next, we will install some useful extensions.
88
89#### Recommended Extensions
chaopengba312ce2017-02-12 03:38:2590
Ming-Ying Chunga7db9dde82022-07-12 06:31:5491You will most likely use the following extensions every day:
92
Ming-Ying Chung8dadf3f32024-03-12 18:47:2793There are 2 ways to install them:
Ming-Ying Chunga7db9dde82022-07-12 06:31:5494
Ming-Ying Chung8dadf3f32024-03-12 18:47:2795* Follow the instructions from
96 [Install Recommended Extensions](#install-recommended-extensions).
97* Manual installation. Jump to the extensions window (`Ctrl+Shift+X`, or
98 `Cmd+Shift+X` in macOS) and search the names of the following extensions.
99
100*** aside
101Note: All the extension settings mentioned below are already set in
102`tools/vscode/settings.json`. You don't have do anything if you have followed
103[the instructions](#setup-for-chromium) to copy that file into your workspace.
104***
105
106* [**ChromiumIDE**](https://marketplace.visualstudio.com/items?itemName=Google.cros-ide) -
107 The critical extension to make Chromium/ChromiumOS development easier and
108 faster by anchoring core tools in one place.
109* [**Chromium Context**](https://marketplace.visualstudio.com/items?itemName=solomonkinard.chromium-context) -
110 Provides Chromium-specific context, e.g. code owners, release version,
111 author blame list, in a single tab for an opened file.
Ming-Ying Chunga7db9dde82022-07-12 06:31:54112* [**C/C++**](https://marketplace.visualstudio.com/items?itemName=ms-vscode.cpptools) -
Jesse McKennafffd8112020-05-08 19:18:48113 Code formatting, debugging, Intellisense. Enables the use of clang-format
114 (via the `C_Cpp.clang_format_path` setting) and format-on-save (via the
115 `editor.formatOnSave` setting).
Ming-Ying Chunga7db9dde82022-07-12 06:31:54116* [**vscode-clangd**](https://marketplace.visualstudio.com/items?itemName=llvm-vs-code-extensions.vscode-clangd) -
117 Enables VS Code to compile Chromium, provide Chromium XRefs to support
Ming-Ying Chung8dadf3f32024-03-12 18:47:27118 functions like jumping to definition, and provide a clangd
119 [language server][lang-server] powering smarter autocompletion than
120 **C/C++** extension's IntelliSense, but they also conflicts with each
Ming-Ying Chunga7db9dde82022-07-12 06:31:54121 other. To resolve the conflict, add the following to `settings.json`:
Ming-Ying Chung8dadf3f32024-03-12 18:47:27122 `"C_Cpp.intelliSenseEngine": "disabled"`. See [clangd.md](clangd.md) for
Ming-Ying Chunga7db9dde82022-07-12 06:31:54123 setup instructions.
Ming-Ying Chunga7db9dde82022-07-12 06:31:54124* [**Toggle Header/Source**](https://marketplace.visualstudio.com/items?itemName=bbenoist.togglehs) -
James Cook9f7c73d2017-06-20 15:06:19125 Toggles between .cc and .h with `F4`. The C/C++ extension supports this as
126 well through `Alt+O` but sometimes chooses the wrong file when there are
127 multiple files in the workspace that have the same name.
Ming-Ying Chung8dadf3f32024-03-12 18:47:27128* [**vscode-proto3**](https://marketplace.visualstudio.com/items?itemName=zxh404.vscode-proto3) -
ljustene262c842017-04-12 08:29:04129 Syntax highlighting for .proto files.
Ming-Ying Chunga7db9dde82022-07-12 06:31:54130* [**Mojom IDL support**](https://marketplace.visualstudio.com/items?itemName=Google.vscode-mojom) -
Ming-Ying Chung8dadf3f32024-03-12 18:47:27131 Syntax highlighting and a [language server][lang-server] for .mojom files.
James Lee36970c242022-07-12 11:44:27132* [**GN**](https://marketplace.visualstudio.com/items?itemName=msedge-dev.gnls) -
133 Code IntelliSense for the GN build system.
Ming-Ying Chunga7db9dde82022-07-12 06:31:54134* [**Rewrap**](https://marketplace.visualstudio.com/items?itemName=stkb.rewrap) -
ljustene262c842017-04-12 08:29:04135 Wrap lines at 80 characters with `Alt+Q`.
Ming-Ying Chunga7db9dde82022-07-12 06:31:54136* [**Remote**](https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-ssh) -
Daniel Murphyd9e88fb2020-03-17 19:26:23137 Remotely connect to your workstation through SSH using your laptop. See the
138 [Remote](#Remote) section for more information about how to set this up.
Ming-Ying Chunga7db9dde82022-07-12 06:31:54139* [**GitLens**](https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens) -
140 Git supercharged. A Powerful, feature rich, and highly customizable git
141 extension.
Ming-Ying Chung8dadf3f32024-03-12 18:47:27142* [**Python**](https://marketplace.visualstudio.com/items?itemName=ms-python.python) -
143 Linting, intellisense, code formatting, refactoring, debugging, snippets.
144 * If you want type checking, add: `"python.analysis.typeCheckingMode": "basic",`
145 to your `settings.json` file (you can also find it in the settings UI).
chaopengba312ce2017-02-12 03:38:25146
Ming-Ying Chung8dadf3f32024-03-12 18:47:27147[lang-server]: https://microsoft.github.io/language-server-protocol/
148
149#### Optional Extensions
150
151The following extensions are not included in
152[//tools/vscode/settings.json](/tools/vscode/settings.json), but they might be
153useful for you as well:
chaopengba312ce2017-02-12 03:38:25154
Ming-Ying Chunga7db9dde82022-07-12 06:31:54155```bash
Ho Cheunga645ddc2024-07-02 05:02:09156$ echo "ryu1kn.annotator wmaurer.change-case shd101wyy.markdown-preview-enhanced Gruntfuggly.todo-tree alefragnani.Bookmarks spmeesseman.vscode-taskexplorer streetsidesoftware.code-spell-checker george-alisson.html-preview-vscode anseki.vscode-color" | xargs -n 1 code --force --install-extension
Ming-Ying Chunga7db9dde82022-07-12 06:31:54157```
158
Ho Cheunga645ddc2024-07-02 05:02:09159* [**Annotator**](https://marketplace.visualstudio.com/items?itemName=ryu1kn.annotator) -
160 Display git blame info along with your code. Can open the diff of a particular commit from there.
Ming-Ying Chunga7db9dde82022-07-12 06:31:54161* [**change-case**](https://marketplace.visualstudio.com/items?itemName=wmaurer.change-case) -
ljustene262c842017-04-12 08:29:04162 Quickly change the case of the current selection or current word.
Ming-Ying Chunga7db9dde82022-07-12 06:31:54163* [**Markdown Preview Enhanced**](https://marketplace.visualstudio.com/items?itemName=shd101wyy.markdown-preview-enhanced) -
164 Preview markdown side-by-side with automatic scroll sync and many other
Tiago Vignatti3e5b18bc2023-03-30 13:13:46165 features with `Ctrl+k v`. This document was written with this extension!
Ming-Ying Chunga7db9dde82022-07-12 06:31:54166* [**Todo Tree**](https://marketplace.visualstudio.com/items?itemName=Gruntfuggly.todo-tree) -
167 Displays comment tags like TODO/FIXME in a tree view in a dedicated sidebar.
168* [**Bookmarks**](https://marketplace.visualstudio.com/items?itemName=alefragnani.Bookmarks) -
169 Supports easy mark/unmark positions in the codebase and displays them in a
170 dedicated sidebar. Very useful for a large codebase like Chromium.
171* [**Task Explorer**](https://marketplace.visualstudio.com/items?itemName=spmeesseman.vscode-taskexplorer) -
172 Displays supported tasks, e.g. vscode tasks, shell scripts and others,
173 organized into a treeview in sidebar.
174* [**Code Spell Checker**](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker) -
175 A basic spell checker that works well with camelCase code. It helps catch
176 common spelling errors.
Ho Cheungc4cd9e52023-04-05 01:32:21177* [**HTML Preview**](https://marketplace.visualstudio.com/items?itemName=george-alisson.html-preview-vscode) -
Tiago Vignatti3e5b18bc2023-03-30 13:13:46178 Previews HTML files while editing with `Ctrl+k v`.
Ming-Ying Chunga7db9dde82022-07-12 06:31:54179* [**Color Picker**](https://marketplace.visualstudio.com/items?itemName=anseki.vscode-color) -
180 Visualizes color codes inline and provides color picker GUI to generates new
181 color codes.
Peter Wenba247f542024-03-15 19:37:47182* [**Bazel**](https://marketplace.visualstudio.com/items?itemName=BazelBuild.vscode-bazel) -
183 This is very useful for editing `*.star` starlark files. If you want "Go
184 to definition" to work in our `infra/config` directory, see the
185 [//tools/vscode/bazel_lsp/README.md][lsp_patches_readme]
186
187[lsp_patches_readme]: ../tools/vscode/bazel_lsp/README.md
Ming-Ying Chunga7db9dde82022-07-12 06:31:54188
chaopengba312ce2017-02-12 03:38:25189
ljustene262c842017-04-12 08:29:04190Also be sure to take a look at the
Jesse McKennafffd8112020-05-08 19:18:48191[VS Code marketplace](https://marketplace.visualstudio.com/VSCode) to check out
192other useful extensions.
chaopengba312ce2017-02-12 03:38:25193
ljustene262c842017-04-12 08:29:04194### Color Scheme
Ming-Ying Chunga7db9dde82022-07-12 06:31:54195
Tiago Vignatti3e5b18bc2023-03-30 13:13:46196Press `Ctrl+Shift+P (Cmd+Shift+P `in macOS`), color, Enter` to pick a color
197scheme for the editor. There are also tons of [color schemes available for
198download on the
ljustene262c842017-04-12 08:29:04199marketplace](https://marketplace.visualstudio.com/search?target=VSCode&category=Themes&sortBy=Downloads).
chaopengba312ce2017-02-12 03:38:25200
Ming-Ying Chunga7db9dde82022-07-12 06:31:54201### Keyboard Shortcuts
202
203#### CheatSheet
204
205* [Windows](https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf)
Tiago Vignatti3e5b18bc2023-03-30 13:13:46206* [macOS](https://code.visualstudio.com/shortcuts/keyboard-shortcuts-macos.pdf)
Ming-Ying Chunga7db9dde82022-07-12 06:31:54207
Tiago Vignatti3e5b18bc2023-03-30 13:13:46208#### Useful Shortcuts (Linux)
Ming-Ying Chunga7db9dde82022-07-12 06:31:54209
ljustene262c842017-04-12 08:29:04210* `Ctrl+P` opens a search box to find and open a file.
211* `F1` or `Ctrl+Shift+P` opens a search box to find a command (e.g. Tasks: Run
Daniel Cheng2d4c2d192022-07-01 01:38:31212 Task). Note: if you want to run one of the [Predefined tasks in
213 tasks.json](#Tasks), it is faster to just use `Ctrl+P` &gt; "task <n>".
ljustene262c842017-04-12 08:29:04214* `Ctrl+K, Ctrl+S` opens the key bindings editor.
215* ``Ctrl+` `` toggles the built-in terminal.
216* `Ctrl+Shift+M` toggles the problems view (linter warnings, compile errors
Quinten Yearsley317532d2021-10-20 17:10:31217 and warnings). You'll switch a lot between terminal and problem view during
ljustene262c842017-04-12 08:29:04218 compilation.
219* `Alt+O` switches between the source/header file.
220* `Ctrl+G` jumps to a line.
221* `F12` jumps to the definition of the symbol at the cursor (also available on
222 right-click context menu).
223* `Shift+F12` or `F1, CodeSearchReferences, Return` shows all references of
224 the symbol at the cursor.
225* `F1, CodeSearchOpen, Return` opens the current file in Code Search.
226* `Ctrl+D` selects the word at the cursor. Pressing it multiple times
227 multi-selects the next occurrences, so typing in one types in all of them,
228 and `Ctrl+U` deselects the last occurrence.
229* `Ctrl+K, Z` enters Zen Mode, a fullscreen editing mode with nothing but the
230 current editor visible.
231* `Ctrl+X` without anything selected cuts the current line. `Ctrl+V` pastes
232 the line.
233
Ming-Ying Chunga7db9dde82022-07-12 06:31:54234*** aside
235Note: See also [Key Bindings for Visual Studio Code
236](https://code.visualstudio.com/docs/getstarted/keybindings).
237***
238
Michael Thiessenf643e29f2020-03-24 20:23:01239### Java/Android Support
Victor Hugo Vianna Silvac37c9b72021-10-28 00:32:32240
Shuhei Takahashic2a265322025-01-10 02:20:16241There are two extensions you can use to get Java/Android support in VSCode:
242
Shuhei Takahashid12f0d22025-01-20 02:22:20243* a. [ChromiumIDE](https://marketplace.visualstudio.com/items?itemName=Google.cros-ide)
244* b. [Language Support for Java™ by Red Hat](https://marketplace.visualstudio.com/items?itemName=redhat.java)
Shuhei Takahashic2a265322025-01-10 02:20:16245
246ChromiumIDE is much faster and more stable than the other extension, mainly
247because it does not rely on background indexing and persistent cache. It works
248without manually running scripts from the command line as the extension knows
249how to extract build configurations from GN. On the other hand, its features are
250limited compared to the other extension (e.g. debugger is not supported yet).
251
252Language Support for Java™ by Red Hat has more features as it is based on the
253Eclipse JDT Language Server. But it is known to be very slow (it takes tens of
254minutes to index the whole project in a single thread before serving requests
255from VSCode) and less stable (it often gets confused when you sync the source
256checkout, forcing you to clear the cache and wait indexing again).
257
258#### a. ChromiumIDE
259
260Install the latest **pre-release** version of
261[ChromiumIDE](https://marketplace.visualstudio.com/items?itemName=Google.cros-ide)
Shuhei Takahashid12f0d22025-01-20 02:22:20262from the VSCode marketplace. Make sure the extension version is **0.35.32** or
Shuhei Takahashic2a265322025-01-10 02:20:16263later.
264
Shuhei Takahashid12f0d22025-01-20 02:22:20265Then just open a VSCode workspace containing Chromium source tree (opening
Shuhei Takahashic2a265322025-01-10 02:20:16266subdirectories is fine) and open a Java file. If you haven't, you're prompted to
267select the default build output directory (e.g. `out/Default`).
268
269#### b. Language Support for Java™ by Red Hat
Michael Thiessenf643e29f2020-03-24 20:23:01270
Etienne Dechamps2d40c552023-06-12 15:52:242711. **Add the following to your VS Code workspace `settings.json`:**
Ho Cheung7c53eaf2024-05-31 00:31:26272
273 ```
274 "java.import.gradle.enabled": false,
275 "java.import.maven.enabled": false
276 ```
277
278 This will prevent the language server from attempting to build *all* Gradle
279 and Maven projects that can be found anywhere in the Chromium source tree,
280 which typically results in hilarity.
281
282 ```
283 "java.jdt.ls.java.home": "<< ABSOLUTE PATH TO YOUR WORKING COPY OF CHROMIUM >>/src/third_party/jdk/current"
284 ```
285
286 This one is optional but reduces the likelihood of problems by making sure
287 the language server uses the same JDK as the Chromium build system (as
288 opposed to some random JDK from your host system).
289
Aldo Culquicondor329da182024-11-07 19:11:08290 Also increase the resources available to the Java Language Server, for
291 example:
292
293 ```
294 "java.jdt.ls.vmargs": "-XX:+UseParallelGC -XX:GCTimeRatio=4 -XX:AdaptiveSizePolicyWeight=90 -Dsun.zip.disableMemoryMapping=true -Xmx64G -Xms100m -Xlog:disable"
295 ```
296
Etienne Dechamps2d40c552023-06-12 15:52:242972. **Install the
298 [*Language Support for Java™ by Red Hat*](https://marketplace.visualstudio.com/items?itemName=redhat.java)
Etienne Dechamps2fba5252023-06-15 18:39:45299 extension.**
Etienne Dechamps2d40c552023-06-12 15:52:24300 You do not need any other extension.
Shuhei Takahashi8b053392024-06-14 01:50:133013. **Build your code** in the usual way (i.e. using gn and ninja commands).
Etienne Dechamps2d40c552023-06-12 15:52:24302 This will produce build config files that are necessary for the next step. It
303 will also make autogenerated code visible to the language server.
Shuhei Takahashi8b053392024-06-14 01:50:133044. **Generate the Eclipse JDT project** by running
305 `build/android/generate_vscode_project.py` from the `src` directory.
306 For example, if your build output directory is `out/Debug-x86` and your build
307 target is `//chrome/android:chrome_java`, run:
308 `build/android/generate_vscode_project.py --output-dir out/Debug-x86 --build-config gen/chrome/android/chrome_java.build_config.json`.
309 This will create `.project` and `.classpath` in the `src` directory.
3105. **Reload** your VS Code window to let it start importing the generated
311 project.
3126. **Open a Java source file then wait a couple of minutes** for the language
Etienne Dechamps2d40c552023-06-12 15:52:24313 server to build the project.
Shuhei Takahashi8b053392024-06-14 01:50:133147. **Done!** You should now have full Java language support for any `.java` file
Etienne Dechamps2d40c552023-06-12 15:52:24315 that is included in the build.
Ming-Ying Chunga7db9dde82022-07-12 06:31:54316
Shuhei Takahashic2a265322025-01-10 02:20:16317##### Known issues
Michael Thiessenf643e29f2020-03-24 20:23:01318
Etienne Dechamps2d40c552023-06-12 15:52:24319* Errors related to `GEN_JNI` are caused by the language server (rightfully)
320 getting confused about multiple definitions of the
Sam Maiere1df6f22023-08-11 14:20:40321 [autogenerated](/third_party/jni_zero/README.md) `GEN_JNI` class. This
Etienne Dechamps2d40c552023-06-12 15:52:24322 is a known quirk of the JNI generator.
Michael Thiessene057a6c2020-03-25 19:24:01323
Shuhei Takahashic2a265322025-01-10 02:20:16324##### Troubleshooting
Shuhei Takahashi8b053392024-06-14 01:50:13325
326* If you have used the previous instructions to use
327 `generate_vscode_classpath.py` or you think something went wrong, try clearing
328 the internal state of the language server by executing
329 `Java: Clean Java Language Server Workspace` from the command palette. This
330 will force the language server to rebuild its internal workspace by importing
331 the generated Eclipse JDT project.
332
Etienne Dechamps2fba5252023-06-15 18:39:45333#### Automatic formatting
334
335Java code in Chromium is formatted using [clang-format](/docs/clang_format.md).
336To get VS Code to use clang-format to format Java files, install the
337[*Clang-Format* extension](https://marketplace.visualstudio.com/items?itemName=xaver.clang-format)
338and set it as the default formatter for Java in your workspace `settings.json`:
339
340```json
341"[java]": {
342 "editor.defaultFormatter": "xaver.clang-format"
343}
344```
345
346To avoid potential formatting differences due to clang-format version skew, it
347makes sense to configure the extension to run clang-format in the same way
348`git cl format` would. You can do this by adding the following to your
349workspace `settings.json`:
350
351```json
352"clang-format.executable": "<< PATH TO YOUR CHROMIUM WORKING COPY >>/src/buildtools/linux64/clang-format"
353```
354
ljustene262c842017-04-12 08:29:04355## Setup For Chromium
356
Ming-Ying Chung8dadf3f32024-03-12 18:47:27357VS Code is configured via JSON files. This section describes how to configure
358it for a better Chromium development experience.
ljustene262c842017-04-12 08:29:04359
Ming-Ying Chung8dadf3f32024-03-12 18:47:27360*** aside
361Note: See [VS Code
362documentation](https://code.visualstudio.com/docs/customization/overview) for a
363more general introduction to VS Code customization.
364***
365
366The Chromium repository comes with some basic configuration. Run the following
367commands to initialize VS Code for your Chromium checkout:
368
369```bash
370cd /path/to/chromium/src
371mkdir .vscode
372cp tools/vscode/*.json .vscode/
373cp tools/vscode/cpp.code-snippets .vscode/
374```
375
376Once you have done, proceed to the next sections to install recommended
377extensions and perform customization.
378
379### Install Recommended Extensions
380
381As described in the [Useful Extensions](#useful-extensions) sections, there are
382essential extensions to help Chromium development. Follow the steps below:
383
Lalit Rana82332dd2024-11-18 18:20:553841. In VS Code's Command Palette (`Ctrl+Shift+P`, or `Cmd+Shift+P` in macOS),
Ming-Ying Chung8dadf3f32024-03-12 18:47:27385 type `Show Recommended Extensions`, and press `Enter`.
3862. In the WORKSPACE RECOMMENDATIONS section of the EXTENSIONS sidebar, click the
387 `Install Workspace Recommended Extensions` (shown as a cloud icon).
388
389Now you are all set.
390
391### Customize Workspace Settings
Ming-Ying Chunga7db9dde82022-07-12 06:31:54392
Daniel Cheng2d4c2d192022-07-01 01:38:31393Open the file [//tools/vscode/settings.json](/tools/vscode/settings.json),
Darwin Huang985c38a2018-11-21 19:24:13394and check out the default settings there. Feel free to commit added or removed
Ming-Ying Chung8dadf3f32024-03-12 18:47:27395settings to enable better team development, or change settings locally in
396`.vscode/settings.json` to suit personal preference.
Raphael Kubo da Costae6e63d32022-09-14 18:17:18397
Raphael Kubo da Costae6e63d32022-09-14 18:17:18398
Ming-Ying Chung8dadf3f32024-03-12 18:47:27399*** aside
Jesse McKennafffd8112020-05-08 19:18:48400Note: these settings assume that the workspace folder (the root folder displayed
Bartek Nowierskifa835f8c2021-02-24 00:36:02401in the Explorer tab) is Chromium's `src/` directory. If this is not the case,
Ming-Ying Chung8dadf3f32024-03-12 18:47:27402replace any references to `${workspaceFolder}` with the path to your `src/`.
403***
Jesse McKennafffd8112020-05-08 19:18:48404
ljustene262c842017-04-12 08:29:04405### Tasks
Ming-Ying Chunga7db9dde82022-07-12 06:31:54406
Dan Harringtonb426cf9b2020-09-10 19:47:08407Next, we'll tell VS Code how to compile our code, run tests, and to read
Ming-Ying Chung8dadf3f32024-03-12 18:47:27408warnings and errors from the build output.
ljustene262c842017-04-12 08:29:04409
Ming-Ying Chung8dadf3f32024-03-12 18:47:27410Open the file `.vscode/tasks.json`. This will provide tasks to do basic things.
411You might have to adjust the commands to your situation and needs. For example,
412before running most of the tasks, you'll need to set the `chromeOutputDir` value
413in that file.
Daniel Cheng2d4c2d192022-07-01 01:38:31414
Tiago Vignatti3e5b18bc2023-03-30 13:13:46415Now you can run tasks by using `Ctrl+P` (`Cmd+Shift+P` in macOS) and typing
416"task " and then a number of your choice. If you select one of the build tasks,
417the build output will display in the terminal pane. Jump through build problems
Ming-Ying Chung8dadf3f32024-03-12 18:47:27418quickly using `F8` / `Shift-F8`. See [task names](#task-names) for more info on
Tiago Vignatti3e5b18bc2023-03-30 13:13:46419running tasks.
Daniel Cheng2d4c2d192022-07-01 01:38:31420
421If you have intellisense enabled but do not have include paths set up correctly,
422jumping through problems will also try to navigate through all the include files
423it cannot locate and add a lot of noise. You can fix your include path or simply
424set intellisense to "tag parser" mode by doing the following:
425
4261. Open Preferences (`Ctrl+Shift+P` &gt; "Preferences: Open User Settings").
4272. Type "intellisense engine" in the settings search box.
4283. Select "Tag Parser" as the provider.
429
Ming-Ying Chung8dadf3f32024-03-12 18:47:27430Note: on a Chromebook, use **🔍+<8th button in the top row that's not ESC>**. In
Daniel Cheng2d4c2d192022-07-01 01:38:31431most cases, this is the top row button that is the closest to be directly above
432the 8 key.
433
ljustene262c842017-04-12 08:29:04434### Launch Commands
Ming-Ying Chunga7db9dde82022-07-12 06:31:54435
ljustene262c842017-04-12 08:29:04436Launch commands are the equivalent of `F5` in Visual Studio: They launch some
437program or a debugger. Optionally, they can run some task defined in
438`tasks.json`. Launch commands can be run from the debug view (`Ctrl+Shift+D`).
Ming-Ying Chunga7db9dde82022-07-12 06:31:54439
Ming-Ying Chung8dadf3f32024-03-12 18:47:27440Open the file at `.vscode/launch.json` and adjust the example launch commands to
441your situation and needs (e.g., the value of "type" needs adjustment for
442Windows).
ljustene262c842017-04-12 08:29:04443
444### Key Bindings
Ming-Ying Chunga7db9dde82022-07-12 06:31:54445
ljustene262c842017-04-12 08:29:04446To edit key bindings, press `Ctrl+K, Ctrl+S`. You'll see the defaults on the
Ming-Ying Chung8dadf3f32024-03-12 18:47:27447left and your overrides on the right stored in the file
448`.vscode/keybindings.json`. Please take a look and adjust them to your situation
449and needs. To change a key binding, copy the corresponding key binding to the
450right. It's fairly self-explanatory.
ljustene262c842017-04-12 08:29:04451
452You can bind any command to a key, even commands specified by extensions like
453`CodeSearchOpen`. For instance, to bind `CodeSearchOpen` to `F2` to , simply add
454`{ "key": "F2", "command": "cs.open" },`.
455Note that the command title `CodeSearchOpen` won't work. You have to get the
456actual command name from the [package.json
457file](https://github.com/chaopeng/vscode-chromium-codesearch/blob/master/package.json)
458of the extension.
459
460If you are used to other editors, you can also install your favorite keymap.
461For instance, to install eclipse keymaps, install the
462`vscode-eclipse-keybindings` extension. More keymaps can be found
463[in the marketplace](https://marketplace.visualstudio.com/search?target=vscode&category=Keymaps).
464
Ming-Ying Chung8dadf3f32024-03-12 18:47:27465### Fixes for Known Issues
Ming-Ying Chunga7db9dde82022-07-12 06:31:54466
Ming-Ying Chung8dadf3f32024-03-12 18:47:27467#### Git on Windows
468
469If you only have the `depot_tools` Git installed on your machine, even though it
470is in your PATH, VS Code will ignore it as it seems to be looking for `git.exe`.
471You will have to add the following to your settings in order for the Git
472integration to work:
473
474```json
475{
476 "git.path": "C:\\src\\depot_tools\\git.bat"
477
478 // more settings here...
479}
ljustene262c842017-04-12 08:29:04480```
481
Ming-Ying Chung8dadf3f32024-03-12 18:47:27482Tip: you can jump to the settings JSON file by using `Ctrl+Shift+P` and using
483the "Preferences: Open User Settings (JSON)" verb (for whatever reason, setting
484`git.path` as a folder setting does not appear to work).
485
Daniel Murphyd9e88fb2020-03-17 19:26:23486### Remote
Ming-Ying Chunga7db9dde82022-07-12 06:31:54487
488*** promo
Ming-Ying Chung8dadf3f32024-03-12 18:47:27489Googlers: See [go/vscode-remote](http://go/vscode-remote) instead.
Ming-Ying Chunga7db9dde82022-07-12 06:31:54490***
491
492VS Code now has a
Daniel Murphyd9e88fb2020-03-17 19:26:23493[Remote](https://code.visualstudio.com/docs/remote/remote-overview) framework
Ming-Ying Chunga7db9dde82022-07-12 06:31:54494that allows you to use VS Code on your laptop while your code is hosted
Daniel Murphyd9e88fb2020-03-17 19:26:23495elsewhere. This really shines when used in conjunction with the vscode-clangd plugin,
496which allows clangd to run remotely as well.
497
498To get this to run, install the Remote pack extension, and then make sure your
499ssh config file has your remote connection:
500
501`~/.ssh/config`:
502```
503Host my-connection
504 HostName my-remote-host.corp.company.com
505```
506
Ming-Ying Chunga7db9dde82022-07-12 06:31:54507VS Code will then list this connection in the 'Remote Explorer' section on the
508left. To launch VS Code with this connection, click on the '+window' icon next
Daniel Murphyd9e88fb2020-03-17 19:26:23509to the listed hostname. It has you choose a folder - use the 'src' folder root.
Ming-Ying Chunga7db9dde82022-07-12 06:31:54510This will open a new VS Code window in 'Remote' mode. ***Now you can install
Daniel Murphyd9e88fb2020-03-17 19:26:23511extensions specifically for your remote connection, like vscode-clangd, etc.***
512
Peter Wen3ba91202020-06-17 15:56:54513#### Chromebooks
514
515For Googlers, [here](http://go/vscode/remote_development_via_web) are
516Google-specific instructions for setting up remote development on chromebooks
517without using Crostini.
518
Daniel Murphyd9e88fb2020-03-17 19:26:23519#### Windows & SSH
Yuwei Huang1c4f50c2021-08-06 22:41:56520
Ming-Ying Chunga7db9dde82022-07-12 06:31:54521VS Code remote tools requires 'sshd' which isn't installed on Windows by
522default.
Yuwei Huang1c4f50c2021-08-06 22:41:56523
Ming-Ying Chunga7db9dde82022-07-12 06:31:54524For Googlers, sshd should already be installed on your workstation, and VS Code
Yuwei Huang1c4f50c2021-08-06 22:41:56525should work remotely if you followed the setup instructions at
526[go/building-chrome-win](http://go/building-chrome-win). If you are still having
527problems, please refer to
528[go/vscode-remote#windows](http://go/vscode-remote#windows).
529
Ho Cheungc083ca12023-04-06 14:22:07530Non-Googlers may follow Microsoft's instructions for
Yuwei Huang1c4f50c2021-08-06 22:41:56531[installing the OpenSSH server](https://docs.microsoft.com/en-us/windows-server/administration/openssh/openssh_install_firstuse).
Ming-Ying Chunga7db9dde82022-07-12 06:31:54532VS Code should work remotely after following this step.
Daniel Murphyd9e88fb2020-03-17 19:26:23533
Dan Harringtonb06ce2f2019-04-09 15:35:29534### Snippets
Yuki Osaki0a255c52021-12-20 05:35:26535
Dan Harringtonb06ce2f2019-04-09 15:35:29536There are some useful snippets provided in
Ming-Ying Chung8dadf3f32024-03-12 18:47:27537[//tools/vscode/cpp.json](/tools/vscode/cpp.json), which are already installed
538to your workspace at `.vscode/cpp.code-snippets`
Mounir Lamouri3b9e31d2019-07-30 20:14:41539
ljustene262c842017-04-12 08:29:04540### Tips
541
542#### The `out` folder
Ming-Ying Chunga7db9dde82022-07-12 06:31:54543
Tiago Vignatti3e5b18bc2023-03-30 13:13:46544Automatically generated code is put into a subfolder of `out/`, which means that
ljustene262c842017-04-12 08:29:04545these files are ignored by VS Code (see files.exclude above) and cannot be
Tiago Vignatti3e5b18bc2023-03-30 13:13:46546opened e.g. from quick-open (`Ctrl+P`). As of version 1.21, VS Code does not
547support negated glob commands, but you can define a set of exclude pattern to
548include only `out/Debug/gen`:
Christian Dullweberbabb96e12018-05-28 14:00:14549```
Christian Dullweberd67c9b32018-04-03 08:30:42550"files.exclude": {
551 // Ignore build output folders. Except out/Debug/gen/
552 "out/[^D]*/": true,
553 "out/Debug/[^g]*": true,
554 "out/Debug/g[^e]*": true,
555 "out_*/**": true,
556},
Christian Dullweberbabb96e12018-05-28 14:00:14557```
Christian Dullweberd67c9b32018-04-03 08:30:42558
559Once it does, you can use
ljustene262c842017-04-12 08:29:04560```
561"!out/Debug/gen/**": true
562```
563in files.exclude instead of the symlink.
564
565#### Using VS Code as git editor
Ming-Ying Chunga7db9dde82022-07-12 06:31:54566
ljustene262c842017-04-12 08:29:04567Add `[core] editor = "code --wait"` to your `~/.gitconfig` file in order to use
568VS Code as editor for git commit messages etc. Note that the editor starts up
569significantly slower than nano or vim. To use VS Code as merge tool, add
570`[merge] tool = code`.
571
572#### Task Names
Ming-Ying Chunga7db9dde82022-07-12 06:31:54573
ljustene262c842017-04-12 08:29:04574Note that we named the tasks `1-build_chrome_debug`, `2-build_chrome_release`
575etc. This allows you to quickly execute tasks by pressing their number:
576Press `Ctrl+P` and enter `task <n>`, where `<n>` is the number of the task. You
577can also create a keyboard shortcut for running a task. `File > Preferences >
578Keyboard Shortcuts` and add `{ "key": "ctrl+r", "command":
579"workbench.action.tasks.runTask", "when": "!inDebugMode" }`. Then it's
580sufficient to press `Ctrl+R` and enter `<n>`.
581
582#### Working on Laptop
Ming-Ying Chunga7db9dde82022-07-12 06:31:54583
Bartek Nowierskifa835f8c2021-02-24 00:36:02584You might want to disable git status autorefresh to save battery.
chaopengca285112017-03-02 15:39:04585
586```
chaopeng5c66dfe2017-03-22 13:51:45587"git.autorefresh": false,
chaopengca285112017-03-02 15:39:04588```
589
Tommy Nyquistdc2ceaa42021-03-15 20:29:04590#### Editing in multiple Git repositories
Ming-Ying Chunga7db9dde82022-07-12 06:31:54591
Tommy Nyquistdc2ceaa42021-03-15 20:29:04592If you frequently work in multiple Git repositories that are part of the Chromium repository, you might find that the built-in tooling does not work as expected for files that exist below folders that are part of a `.gitignore` file checked in to Chromium.
593
594To work around this, you can add the directories you edit as separate `folders` entries in your workspace configuration, and ensure that the directories that are ignored in Chromium are listed **before** the Chromium `src` path.
595
596To edit this, go to `Settings` -> Select the `Workspace` tab, and choose to open as JSON (button in the top right), and configure `folders` like this (change paths to match your local setup and usage):
597
598```
599{
600 "folders": [
601 {
602 "path": "chromium/src/third_party/perfetto"
603 },
604 {
605 "path": "chromium/src"
606 }
607 ]
608}
609```
610
Jianpeng Chaob4048b82018-08-28 23:40:01611### Unable to open $File resource is not available when debugging Chromium on Linux
Ming-Ying Chunga7db9dde82022-07-12 06:31:54612
Jianpeng Chaob4048b82018-08-28 23:40:01613Chromium [recently changed](https://docs.google.com/document/d/1OX4jY_bOCeNK7PNjVRuBQE9s6BQKS8XRNWGK8FEyh-E/edit?usp=sharing)
614the file path to be relative to the output dir. Check
615`gn args out/$dir --list` if `strip_absolute_paths_from_debug_symbols` is true (which is the default),
Raphael Kubo da Costac85b5132022-09-14 18:49:20616set `cwd` to the output dir. otherwise, set `cwd` to `${workspaceFolder}`.
Jianpeng Chaob4048b82018-08-28 23:40:01617
chaopengba312ce2017-02-12 03:38:25618### More
Ming-Ying Chunga7db9dde82022-07-12 06:31:54619
ljustene262c842017-04-12 08:29:04620More tips and tricks can be found
Ryan Tarpine78d07f82022-11-14 16:19:27621[here](https://code.visualstudio.com/docs/getstarted/tips-and-tricks).