TypeScript Essentials - Extension Pack for Visual Studio Code

This extension pack for Visual Studio Code adds extensions that are useful for TypeScript projects. I reserve the right to update the extensions pack contents up to my own discretion. This extension is for my personal use, I think it's great if it works for other people too.

Reasons

The TypeScript Essentials extension pack was made to automate and standardize the installation phase of the essential TypeScript extensions for Visual Studio Code every time a new member joins the team, or one of them restores a laptop, or exchanges it for a new one.

See the CHANGELOG for the latest changes

settings.json

It is strongly recommended that these settings be used in your workspace. You must copy and paste them, and if you need to adjust something you will already know where to do it.

{
    /**
     * JavaScript Essentials Config
     */
	"[javascript]": {
		"editor.defaultFormatter": "vscode.typescript-language-features"
	},
	"javascript.format.enable": true,
	"javascript.format.semicolons": "insert",
	"javascript.preferences.quoteStyle": "single",
	"eslint.enable": true,
	"eslint.codeAction.showDocumentation": {
		"enable": true
	},
	"eslint.codeAction.disableRuleComment": {
		"enable": true,
		"location": "sameLine"
	},
	"npm-intellisense.importES6": true,
	"npm-intellisense.importQuotes": "'",
	"npm-intellisense.importLinebreak": ";\r\n",
	"npm-intellisense.importDeclarationType": "const",
	/**
     * The following line is for the specific configuration of the 
     * Path-Intellisense extension over Javascript
     */
	"javascript.suggest.paths": false,
	"path-intellisense.showHiddenFiles": true,
	"formattingToggle.affects": [
		"editor.formatOnPaste",
		"editor.formatOnType"
	],
	/**
     * TypeScript Essentials Config
     */
	"[typescript]": {
		"editor.defaultFormatter": "vscode.typescript-language-features"
	},
	"typescript.format.enable": true,
	"typescript.format.semicolons": "insert",
	"typescript.preferences.quoteStyle": "single",
	/**
     * The following line is for the specific configuration of the 
     * Path-Intellisense extension over Typescript
     */
	"typescript.suggest.paths": false,
}

If you are using the VSC-Essentials extension pack additionally, you can see the complete settings file here (settings.json)

Consider that if you would rather use ESLint as the default code formatter, rather than the one that comes with VSCode, you will need to change this settings in your settings.json file:

"[javascript]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
},
"[typescript]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
},

For this others:

"[javascript]": {
    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
},
"[typescript]": {
    "editor.defaultFormatter": "dbaeumer.vscode-eslint"
},

As far as using the Debugger for Firefox entails, I highly recommend reading its documentation in order to get a full debugging experience.

TypeScript TSLint Language Service Plugin

the TSLint extension used to be part of this extension pack until it was deprecated. If you search the marketplace, it is still there if you need it, But in most cases what is recommended is to migrate to ESlint, which supports the same functionality. There is a diverse range of documentation of interest about the process, so I will leave below what I think is the most convenient:

tslint-to-eslint-config, Converts your TSLint configuration to the closest reasonable ESLint equivalent.
Migrate from TSLint to ESLint, TSLint has been the recommended linter in the past but now TSLint is deprecated and ESLint is taking over its duties. This article will help you migrate from TSLint to ESLint.
typescript-eslint, The tooling that enables ESLint and Prettier to support TypeScript.
TSLint GitHub, the original TSLint repository, from Palantir Technologies.