Лучшие расширения для лучшего редактора кода

Этот пост изначально был опубликован на The Smart Coder.

В 2017 году у Visual Studio Code было 2,6 миллиона активных пользователей в месяц (последнее официальное число, которое я смог найти - сейчас, безусловно, больше), и это, возможно, лучший редактор кода на данный момент. Одна из лучших функций - Market Place, предлагающий множество расширений, позволяющих настроить его в точности в соответствии с вашими потребностями и помогающий вам в написании высококачественного кода. В этой статье я порекомендую 10 расширений VS Code для интерфейсных инженеров, работающих с HTML, CSS, JavaScript и такими фреймворками, как VueJS или ReactJS.

Фрагменты кода JavaScript

Это расширение было создано Харалампосом Карипидисом и было загружено 4,5 миллиона раз. Он предоставляет фрагменты кода для написания JavaScript, Typescript, React, Vue, HHTML,… и поддерживает синтаксис ES6.

НПМ

Каждый разработчик знает NPM - диспетчер пакетов узлов. Это расширение помогает управлять вашим Package.json, выдает предупреждения, если зависимости еще не установлены, и помогает с контролем версий.

Красивее

Prettier от Эсбена Петерсена - довольно интересное расширение, которое было загружено около 14 миллионов раз. Он помогает форматировать код и предоставляет ключевые слова для более читаемого кода.

CSS Peek

CSS Peak помогает при работе со строками и идентификаторами классов языка разметки, определяя и перечисляя различные стили, которые уже применяются. Это удобно, потому что вам больше не нужно переключаться между файлами HTML и CSS.

Ветур

Vetur - это официальное расширение VueJS, которое было загружено более 20 миллионов раз. Он предоставляет возможности проверки ошибок, функции автозаполнения и предоставляет фрагменты Vue. Это действительно здорово, если вы такой же разработчик Vue, как я!

ESLint

ESLint - что я могу сказать. Многие любят линтинг, многие - нет. Но ценность линтинга для чистого кода вряд ли спорна, и это расширение с 24 миллионами загрузок - лучший инструмент для этого, если вы разрабатываете с помощью JavaScript.

Живой компилятор Sass

Расширение Live Sass Compiler - это небольшой, но мощный инструмент, который может компилировать ваши файлы SASS / SCSS в файлы CSS в реальном времени и обеспечивать предварительный просмотр скомпилированных стилей в вашем браузере.

Отладчик для Chrome

Chrome для многих разработчиков является браузером номер один, когда речь идет о разработке, тестировании и отладке их кода. С помощью этого официального расширения для VS Code вы можете делать это прямо из Visual Studio Code - насколько это круто ?!

Живой сервер

Live Server от Ритвика Дея, который также создал Live Sass Compiler, создает локальный сервер разработки прямо в Visual Studio Code для обслуживания ваших статических и динамических сайтов. Используя кнопку запуска в вашем редакторе, вы можете сразу же запустить свой код, а расширение также поддерживает перезагрузку в реальном времени - аккуратно!

Украсить

И последнее, но не менее важное в этой коллекции - Beautify, еще одно отличное расширение для форматирования кода, во многом похожее на Prettier. Почти 12 миллионов загрузок говорят сами за себя, и вы можете форматировать код, написанный на JavaScript, JSON, CSS, Sass и HTML.

Заключение

Этот сборник далеко не полный, и расширения не обязательно являются лучшими, но я надеюсь, что он предоставляет вам несколько хороших инструментов, которые помогут вам написать высококачественный код и стать лучшим веб-разработчиком. Дайте мне знать в комментариях, если вы найдете что-то полезное или у вас есть другие предложения по расширению, которые, по вашему мнению, являются первоклассными.