VS Code setup
Open extensions and search for
Install and enable all the recommended extensions. Read more about workspace recommended extensions in VS Code official docs.
Enable Volar Take Over Mode
- Disable built-in TypeScript extension:
@builtin typescript andin extensions panel
- Reload VSCode
Check full discussion on Volar repo.
Comment Anchors Extension
We use Comment Anchors extension for quick navigation within a file. We have provided our own extension settings for providing anchors in the file. You can refer to these settings in
We also provided the snippet for adding the comment anchors. You can find this snippets in
We use "👉" for adding anchors to the code. You can get this emoji by writing
space if popup doesn't open) and choosing
Secondary Sidebar 🦸
Secondary sidebar is game changer for code navigation when combined with this extension. Press
p and search for secondary sidebar.
After this you will get the new sidebar on the right. Now drag the comment anchors extension panel from left sidebar to right sidebar.
With above changes now you code editor will look like below. Notice, main sidebar on left and secondary sidebar with comment anchors on right for in file code navigation.
Once, you have the file with the comments anchor setup you will get the list of anchors in secondary sidebar that is placed on right.
We also provide useful snippets for boosting your productivity. You can find them in
.vscode/ directory. Files ending with
.code-snippets are snippets.