VSCode Installation
Installation Steps for Both Windows and Mac
Last updated
Installation Steps for Both Windows and Mac
Last updated
VS Code is the same editor used by stackblitz so it should look familiar. VS Code is the preferred editor for angular / ionic because both vs-code and typescript were developed by Microsoft. VS-code provides amazing intellisense, autocompletion of our code out the box, along with a host of other plugins that improve and customize the editor.
We will begin by setting up a coding environment on your local machine, we will be using VS Code for the remainder of the Ionic Course and the following group project. Download VS Code Here.
VS Code is supported by Windows, Mac OS, and Linux. Be sure to download the appropriate installer for your system.VS Code Installer Options, Choose your OS.
Success! VS Code Install Complete
In this step we will change VS Code to use the proper shell, bash instead of the default Powershell Windows uses.
While in VS Code you can open a new terminal with the following keyboard shortcut. The ` is a tilde, the button to the left of the 1 key.
Notice the $ in the above prompt. That is a bash shell you are good to go and can skip to the next step otherwise continue on.
Below Images show Shells now using bash, notice it is missing the $ in the prompt.Windows terminal and powershell
Now we want to use BASH as your default shell in VSCODE. To do this You can also select the dropdown in the terminal. If your terminal is not open press CTRL + ` to open it.
Now exit VS Code and restart the application and open a new terminal
You should see $ in the prompt and the terminal says bash the top center. Your prompt might display more information and look a little different that is okay. BASH Shell
Success! If you have bash setup with VS Code
Installing these extensions is optional, but may improve your experience while using VS Code
This extension allows matching brackets to be identified with colors. The user can define which characters to match, and which colors to use.
A simple extension to make indentation more readable.
Helps with formatting and indentation.
Press F1 and type "Beautify file" or "Beautify selection"
Set a keyboard shortcut by going to Code > Preferences > Keyboard Shortcuts