Skip to content
This repository was archived by the owner on Oct 18, 2025. It is now read-only.

Code Editor Setup

Frank Matranga edited this page Jul 6, 2019 · 7 revisions

Please use Visual Studio Code as your editor, as it's the easiest to get up and running and provides all the tools you'll probably ever need for development. Plus, there are config files in the repo specifically for VSCode to set it up ideally for working on LATE. If you have a really good reason to use another IDE, you can but I promise it will be much more difficult than using VSCode for LATE.

a. Installation

Visual Studio Code (VSCode) can be installed from the official site.

b. Extensions

In order for VSCode to work well with the types of files LATE uses, we need to install a few extensions. There are also some recommended ones that just make the coding experience easier as well. VSC will also recommend you to install these extensions if you haven't already.

Navigate to the Extensions (Ctrl+Shift+X) panel on the sidebar. Next to the names of the packages below the package-ids are given. Search for the extensions by name or and ensure its the right package ID before installing.

VSCode screenshot

Required Plugins:

  • ESLint dbaeumer.vscode-eslint
  • Vetur octref.vetur

Recommended Plugns

  • Bracket Pair Colorizer coenraads.bracket-pair-colorizer
  • GitLens eamodio.gitlens

c. Workspace Settings

VSCode should automatically format our JS and .vue files since the repository has a vscode settings file included in it.

The settings.json (Ctrl + ,) shoud look similar to the following:

	...
    "editor.tabSize": 2,
    "eslint.autoFixOnSave": true,
    "eslint.validate": [
    {
        "language": "vue",
        "autoFix": true
    },
    {
        "language": "html",
        "autoFix": true
    },
    {
        "language": "javascript",
        "autoFix": true
    }
    ],
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    "vetur.format.defaultFormatter.html": "js-beautify-html"
	...

d. Integrated Terminal

VSCode comes with an integrated terminal (Ctrl + `) that makes running commands without leaving the editor super easy! You can also manage multiple terminals and split them. Use this to run $ npm run frontend on one side and $ npm run backend on the other!

VSCode

Check out how to configure the terminals if on WSL

Clone this wiki locally