Преимущества перед Sublime Text 3

• Бесплатный, и окна не вылазят
• Терминал: из коробки
• Git: из коробки
• Дебаггер: из коробки
• Плагины: описание, установка, кол-во скачиваний, прозрачность, их много
• Гибкость: настроить можно всё
• Автоподставление классов, переменных, функций
• Перемещение по ссылкам
• Поддержка русского языка
• Уже чем-то начинает походить на IDE

Недостатки перед Sublime Text 3

• "Ест" оперативной памяти в 2-3 раза больше

MUST HAVE:

1. ES7 React/Redux/GraphQL/React-Native snippets (быстрый ввод)
2. Auto Close Tag (авто-подстановка закрывающего тега)
3. Auto-Open Markdown Preview (превью md-файлов)
4. Auto Rename Tag (авто-переименование)
5. Bracket Pair Colorizer (подсветка парных тегов, скобок и т.д.)
6. ESLint (js-линтер)
7. GitLens (история каждой строки)
8. Git History (git editor) - не работает в Linux
9. NPM Scripts (запуск npm-скриптов из package.json)
10. npm (будет подсвечивать неустановленные пакеты из package.json)
11. npm intellisense (при импортах пути будут видеть пакеты из package.json)
12. Svg Preview (превью svg изображений)
13. Sublime Text Keymap (горячие клавиши как в Sublime)
14. Sass (подсветка снтаксиса)
15. EditorConfig for VS Code (стайл-гайд)
16. GraphQL for VSCode (поддержка синтаксиса)
17. IntelliSense for CSS class names in HTML (автокомплит css-классов)
18. Thunder Client (тест API)
19. Tabnine (подключеи ИИ для заполнения)

OPTIONAL:

1. Beautify (авто-форматирование кода, можно пользоваться встроенным Format Document)
2. Prettier - Code formatter (code format)
3. Terminal (уже встроенно)
4. Mithril Emmet (вроде как уже встроенно)
5. Autofilename (вроде как уже встроенно)
6. vscode-pdf (поддержка pdf)
7. VS Code Live Share (презентация кода)
8. Docker (интеграция)
9. Live server (запуск html-файлов из редактора)
10. Bookmarks (закладки) (Ctrl + Alt + K, J)

User Settings

{
  "breadcrumbs.enabled": true, (default)

  "gitlens.advanced.messages": {
    "suppressResultsExplorerNotice": true,
    "suppressShowKeyBindingsNotice": true
  },
  "git.autofetch": true,
  "git.enableSmartCommit": true,
  "gitlens.keymap": "alternate",

  "editor.fontFamily": "Consolas",
  "editor.fontSize": 18,
  "editor.letterSpacing": 0, (default)
  "editor.lineHeight": 25, (23 default)
  "editor.formatOnPaste": true,
  "editor.minimap.enabled": false,
  "editor.minimap.scale": 2, (0 default)
  "editor.multiCursorModifier": "ctrlCmd",
  "editor.snippetSuggestions": "top",
  "editor.renderControlCharacters": false,
  "editor.renderWhitespace": "all",
  "editor.rulers": [100],
  "editor.tabSize": 2,
  "editor.padding.top": 10,
  "editor.padding.bottom": 10,
  "editor.wordWrap": "on",

  "emmet.includeLanguages": {
    "javascript": "javascriptreact",
  },
  "emmet.syntaxProfiles": {
    "javascript": "jsx",
    // "javascript": "html",
  },

  "explorer.confirmDelete": false,
  "explorer.confirmDragAndDrop": false,

  "npm-scripts.showStartNotification": true,

  "terminal.integrated.shell.windows": "C:\\Program Files\\Git\\bin\\bash.exe",
  "terminal.integrated.shell.linux": "/bin/bash",


  "javascript.updateImportsOnFileMove.enabled": "always",
  "javascript.implicitProjectConfig.experimentalDecorators": true,

  "window.zoomLevel": 0,
  "workbench.colorTheme": "Monokai",
  "workbench.statusBar.visible": true
}

1. Открыть консоль в Sublime text 3 (View - Show console)
2. (Ctrl + Shift + P) Install Package control

1. Emmet

---

2. AutoFileName - пути к файлам

---

3. BracketHighlighter - подсветка скобок и парных тегов

---

4. A File Icon - иконки для файлов в сайдбаре

---

5. ColorHighliter - подсветка цветов в CSS

---

6. Terminal - открывать терминал командой

---

7. LESS - поддержка синтаксиса

---

8. SASS - поддержка синтаксиса

---

9. Babel - поддержка синтаксиса

---

10. SideBarEnhancements - расширение функций сайдбара

---

11. Bootstrap 3 Snippets

---

12. Bootstrap 4 Snippets

---

13. JavaScript Snippets - автозаполнение

---

14. JavaScript Completions - автозаполнение хорошее

---

15. jQuery Snippets

---

16. CodeFormatter - форматирование

---

17. HTML Minifier - минификатор HTML, CSS, JS

---

18. BufferScroll - запоминает сворачивание блоков

---

19. EditorConfig - запоминает форматирование кода (download)

---

20. SublimeLinter - Линтер

---

21. SublimeLinter - eslint - JS-линтер

---

Преимущества:

• Профессиональное IDE
• В нём есть всё из коробки
  • Git
  • Консоль
  • Деббагер
  • Сервер и куча всего...

Недостатки

• Платный
• Сложный
• Немультиязычный
• Забирает много оперативной памяти

1. Beautify (форматор html,css,js-кода) Ctrl + Shift + L
2. Emmet
3. Extract for Brackets (PSD-файлы)
4. Interactive Linter (html,css линтер)
5. Minifier (html,css,js-минификатор) Ctrl + M
6. Autoprefixer (автоматические префиксы)