VS Code settings for EDA computers

eda-vs-code-setup.md

IMPORTANT: This gist should be considered archived. You can find the currently maintained instructions at https://github.com/dev-academy-programme/computer-setup.

VS Code settings for EDA computers

This setup uses a global eslint installation. VS Code will use a locally installed/project-based ESLint installation, but if it doesn't find one, it will use this global one.

The following steps are best to be applied in order.

1. Install npm packages

npm install -g \
git-iam \
eslint@5.16.0 \
babel-eslint@10.0.1 \
eslint-config-standard@12.0.0 \
eslint-plugin-import@2.17.3 \
eslint-plugin-node@9.1.0 \
eslint-plugin-promise@4.1.1 \
eslint-plugin-react@7.13.0 \
eslint-plugin-standard@4.0.0

2. Install VS Code extensions

• ESLint
• vscode-icons

3. Edit VS Code's User Settings

File ➡️ Preferences ➡️ Settings

{
  "editor.tabSize": 2,
  "workbench.iconTheme": "vscode-icons"
}

4. Edit VS Code's keybindings.json

This enables CMD+b to automatically fix as many linting errors/warnings as it can with a single shortcut.

File ➡️ Preferences ➡️ Keyboard Shortcuts (and then click on keybindings.json). Use this as the contents.

[
  {
    "key": "cmd+b",
    "command": "eslint.executeAutofix",
    "when": "editorFocus"
  }
]

5. Create ~/.eslintrc.json

{
  "parser": "babel-eslint",
  "env": {
    "browser": true,
    "node": true,
    "jest": true
  },
  "extends": [
    "eslint:recommended",
    "plugin:react/recommended",
    "standard"
  ],
  "plugins": [
    "standard",
    "promise"
  ],
  "rules": {
    "eol-last": ["error", "always"],
    "no-multiple-empty-lines": [
      "error", { "max": 1, "maxEOF": 0, "maxBOF": 0 }
    ],
    "object-curly-spacing": [2, "always"],
    "react/prop-types": "off"
  },
  "settings": {
    "react": { "version": "detect" }
  }
}

6. Configure git-iam

1. Edit the appropriate cohort file at https://github.com/enspiral-dev-academy/students with student details
2. In GitHub, navigate to the file, click the "Raw" button and copy the URL to your clipboard
3. Initialise git-iam with the cohort's URL: git-iam --init [URL on your clipboard]
4. Test that it works: git iam [a name from the list]