WissmannWeb Editor Essentials - Extension Pack for VS Code

This extension pack for Visual Studio Code adds extensions that are amazingly useful for development with VS Code.

See the CHANGELOG for the latest changes

As tools evolve, the usefulness of extensions come and go. I reserve the right to update the extension pack's contents up to my own discretion.

Recommended Settings

Here are some of my recommended settings. These are optional, but I get asked a lot for them, so here they are.

Editor settings

  "workbench.colorTheme": "Default Light+",
  "workbench.iconTheme": "material-icon-theme",
  "workbench.startupEditor": "newUntitledFile",

  "editor.renderIndentGuides": false,
  "editor.formatOnSave": true,
  "editor.formatOnPaste": false,
  "editor.formatOnType": false,
  "editor.minimap.enabled": false,
  "editor.renderWhitespace": "none",
  "editor.tabCompletion": "on",
  "editor.wordWrap": "off",
  "editor.detectIndentation": false,
  "editor.suggestSelection": "first",

  "extensions.ignoreRecommendations": true,

  "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",

  "git.autofetch": true,

  "npm.packageManager": "yarn",

  "[html]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[json]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[jsonc]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },

Prettier settings

  "prettier.singleQuote": true,
  "prettier.printWidth": 140,

Todo Tree settings

  "todo-tree.filtering.excludeGlobs": [
      "**/node_modules/**",
      "**/dist*/**"
    ],
  "todo-tree.tree.flat": true,
  "todo-tree.tree.showScanModeButton": false,

Included

Here is the list of extensions the pack includes:

• Auto Rename Tag - Auto rename paired HTML/XML tag
• Bracket Pair Colorizer 2 - A customizable extension for colorizing matching brackets
• Debugger for Chrome - Debug your JavaScript code in the Chrome browser.
• EditorConfig for VS Code - EditorConfig Support for Visual Studio Code
• Git Graph - Graph for Git
• gitignore - A extension for Visual Studio Code that assists you in working with .gitignore files.
• Live Share - Real-time collaborative development
• Material Icon Theme - Material Design Icons for Visual Studio Code
• Path Intellisense - Visual Studio Code plugin that autocompletes filenames
• npm Intellisense - Visual Studio Code plugin that autocompletes npm modules in import statements
• Prettier - Code formatter - VS Code plugin for prettier/prettier
• Remote Development - An extension pack that lets you open any folder on a remote system.
• Todo Tree - Show TODO, FIXME, etc. comment tags in a tree view
• Visual Studio IntelliCode - AI-assisted development