10 лучших VS Code-расширений 2018 года для фронтенд-разработчиков

[DSolodukhin]

Из расширений, которыми пользуюсь лично я (разработка на Angular), я бы добавил еще:

• Angular Language Service Добавляет в шаблоны такие полезности, как автодополнение, переход к определению в коде и пр.
• angular2-switcher Переключение с клавиатуры между .html, .ts, .css компонента
• TSLint Собственно линтер для TS.
• Paste JSON as Code Генерация классов из json. Результат не всегда идеальный, но как рыба для дальнейшего улучшения вполне достойно.

[LeusMaximus]

ECMAScript Quotes Transformer
Change Case
Jumpy
Project manager
vscode-faker

[Vlad_IT]

Вот некоторые расширения которые я использую в разработке на VueJS

Auto close tag — закрывает теги
Auto rename tag — переименовывает теги
Babel ES6/ES7 — добавляет подсветку синтаксиса к ES6/ES7
Beautify — причесывает код
Bracket Pair Colorizer — для разноцветной подсветки фигурных и обычных скобок в JS. Удобно чтобы не теряться.
eWam Plugin
Import Cost — показывает размер файлов импорта, удобно, чтобы знать, сколько таскаешь за собой.
Indent-rainbow — каждый уровень таба подсвечивает своим цветом, удобная штука, для питона в самый раз.
Paste and Indent — чтобы при вставке из буфера обмена, автоматически выравнивались отступы.
Path Intellisense
Sass от Robin Eentley
Sorting HTML and Jade attributes — сортирует атрибуты элементов HTML/PUG/Jade
vscode-svgviewer — просматривает svg файл картинкой, т.к. VSCode обычно его редактирует.
TODO-HIGHLIGHT — подсветка ключевых слов TODO:, FIXME
VSCode Great Icons — иконки для файлов
VSCode-spotify — Работает с плеером Spotify, внизу на статус панели появляется плеер. На винде не очень работает, умеет только отображать песню и нажимать паузу, а переключать песни может только на MacOS. В покупкой клавиатуры с медиа клавишами, надобность в этом расширении пропала (разве что посмотреть название песни).
Vue Peek — для Vuejs. Переходит по клику на компонент в шаблоне, на его файл.
Vue 2 Snippets
vue-beautify

[ardentum]

Blueprint – простой, но очень полезный экстеншн для создания шаблонов файлов и целых директорий. В пару действий можно создать директорию вроде

ComponentName
  ComponentName.jsx
  ComponentName.scss
  index.js

с нужным стартовым содержимым. Можно использовать шаблонизацию для использования имени шаблона в самом коде (export default ComponentName ...)

[Splo1ter]

Можно еще добавить TypeScript Hero

[Taraflex]

Нуу… такой себе списочек
Live Server — зачем, когда есть webpack?
Live Sass Compiler — зачем, когда есть webpack?
NPM — актуальные версии npm автоматом подтягивают отсутствующие зависимости при установке любого пакета — не установить какой-либо пакет очень сложно. Для отслеживания же устаревших
зависимостей есть более продвинутый Version Lens, который не только с npm умеет работать.
Prettier — зачем оно нужно, если автоформат в vscode и так отличный по дефолту?
Vetur — жрет столько ресурсов, что по крайней мере на моей машине не применимо. Да и зачем, если можно просто настроить vscode обрабатывать vue файлы как обычные html?
CSS Peek — оно же не сможет разрулить все хитросплетения взаимных подключений файлов стилей друг в друга, использования миксинов, циклов, подключений стилей и node_modules и прочего фарша.

Мой список

andrejunges.Handlebars
bmewburn.vscode-intelephense-client
christian-kohler.path-intellisense
cssho.vscode-svgviewer
dawhite.mustache
geddski.macros
golf1052.code-sync
kokororin.vscode-phpfmt
mike-co.import-sorter
mrmlnc.vscode-apache
mrmlnc.vscode-csscomb
mrmlnc.vscode-jade-snippets
neilbrayfield.php-docblocker
pflannery.vscode-versionlens
phproberto.vscode-php-getters-setters
richie5um2.vscode-sort-json
shanoor.vscode-nginx
sidneys1.gitconfig
sysoev.language-stylus
techer.open-in-browser
twxs.cmake
wmaurer.change-case
wordpresstoolbox.wordpress-toolbox
zhuangtongfa.Material-theme
zxh404.vscode-proto3
nidu.copy-json-path
joelday.docthis
mitchdenny.ecdc
hanneshdc.js-eval-replace
tyriar.sort-lines
dtsvet.vscode-wasm

[faiwer]

А никому не попадалось плагина, позволяющего лазать по файловой системе, используя fuzzy-поиск?

т.е. вот так

Очень привык к fuzzy-file-nav в sublime. Ищу такой же для vscode.
ой, я хотел в корень ветки написать, но написал вам, sorry :)

[EvilFox]

Так оно и так работает. F1 и стереть ">" дальше набор будет искать по директориям что добавлены в рабочее пространство.

[faiwer]

Про поиск в рамках рабочего пространства я знаю. Речь про произвольный доступ к ФС. Куда угодно. Не буду же я / добавлять в workspace.

P.S. F1 жать не надо, можно просто ctrl+P

[EvilFox]

Есть похожее типа такого.

[faiwer]

Да, по сути примерно тоже самое. Спасибо!

[Vampireos]

Возможно вам будет интересен файловый менеджер с таким подходом
fman.io

[Zet_Roy]

Где расширения для Реакта?

[softshape]

Вот здесь? marketplace.visualstudio.com/search?term=react&target=VSCode

[Madeas]

я бы еще сюда добавил из используемых:
hookyQR.minify — минификация css + map
mrmlnc.Autoprefixer
Alessandro.Bookmarks — создает закладки для быстрого передвижения
Jake.cdnjs — подгружает библиотеки
Matt.Color info — отображает цвета в различных форматах
mrmlnc.CSSComb