Installing extensions

In this section, we will install some important extensions for VS Code that will help us in the development of Angular applications.

To go to EXTENSIONS in VS Code, find the Extensions tab on the left bar:

You can also find the extension you are looking for by using Ctrl + Shift + P on Windows or command + Shift + P on macOS, typing View: Show Extensions, and then searching for the extensions from the large VS Code extensions library and installing them. Let's go over some of the essential Angular extensions that are available and should be installed:

  • Angular Essentials: This is an extension pack for VS Code that consists of various extensions that will be helpful for Angular development. These extensions include Angular Language Services, Angular v7 Snippets by John Papa, EditorConfig, TSLint, and Prettier.
  • Angular Language Services: This extension provides a rich editing experience in internal as well as external HTML templates, such as auto-completion, go to definition, and quick info:

  • Angular Snippets: This is a snippet extension that has shortcuts to different useful snippets for all the different file types, that is, HTML, CSS, and TypeScript.
  • TSLint: Following a strong coding practice is important, and that's where linting comes into the picture. TSLint is a linter for TypeScript code and helps projects follow strong guidelines. If you use this extension, you will get real-time errors and warnings in your editor that will help you resolve code formatting or code errors.
  • Prettier: Prettier is a very opinionated code formatter that supports multiple languages, including TypeScript, HTML, and CSS. This extension allows you to auto fix any formatting issues based on the Prettier settings of the project.
  • Angular Console: This extension adds Angular Console directly to VS Code.

Other extensions that I use for Angular development are Bracket Pair Colorizer, angular2-switcher, angular2-inline, Path Intellisence, Git Blame, Git History, and GitLens.

Now that we have our extensions installed, let's look at how we can control them using VS Code settings.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
18.217.220.114