Сделайте свою жизнь проще с помощью этих обязательных расширений VS Code.
Написание кода Javascript в наши дни может быть беспокойным - я думаю, что все согласятся с этим. Какое решение? Нет однозначного решения, но использование лучших доступных в отрасли инструментов может немного облегчить нашу жизнь.
Совет: используйте Bit.dev для обмена JS-модулями
Bit.dev (Github) - это инструмент и платформа, которые делают совместное использование модулей кода простым и легким. Будь то функция JS или компонент React / Vue / Angular - Bit позволяет вам делиться им между вашими проектами и сотрудничать с вашей командой. Bit также предлагает отличный пользовательский интерфейс и поисковую систему, чтобы сделать ваши модули кода / компоненты пользовательского интерфейса легко обнаруживаемыми - он даже отображает их вживую.
VS Code - это кроссплатформенный редактор с открытым исходным кодом, который многие разработчики включили в свои инструменты. VS Code - это мощный редактор, в который по умолчанию встроены различные функции, и эти функции могут быть расширены с помощью таких вещей, которые называются расширениями.
Устали писать слишком много
console.log?
Устали форматировать код вручную, чтобы он выглядел аккуратно?
Хотелось бы, чтобы было меньше нажатий клавиш для самых повторяющихся операторов в мире javascript?
Если ваш ответ на любой из приведенных выше вопросов - ДА, не волнуйтесь, потому что вы попали в нужное место.
Не тратя больше вашего времени, вот обязательные расширения VS Code:
1. ESLint
Если вы не делаете линта в коде, то самое время сделать. Как только вы начнете использовать линтинг, он сделает вашу жизнь намного лучше и проще. Вы не будете тратить часы на отладку мелких синтаксических ошибок или неправильного имени переменной.
Расширение ESLint обеспечивает возможность линтинга вашего VS-кода и позволяет вам писать лучший код на лету. Как только вы начнете его использовать, вы больше никогда не вернетесь.
2. Красивее
Устали создавать код вручную? Прохладный. Установите Prettier.
Prettier - самоуверенный разработчик кода, и ему все равно, как вы пишете код. Он просто аккуратно и аккуратно форматирует ваш код.
3. Фрагменты кода JavaScript (ES6).
Написание одних и тех же повторяющихся утверждений может быть утомительным. Каждый раз, когда вы пишете одну и ту же строку для импорта модуля или нажимаете клавиши для записи console.log , это может раздражать. И тут на помощь приходят фрагменты кода JavaScript ES6.
Он предоставляет вам триггеры для каждого фрагмента. Взгляните на приведенную ниже таблицу:
Напишите триггер и нажмите вкладку, чтобы увидеть волшебство.
4. Раскраска для пары скобок
Вложенный код может быть очень запутанным, и как бы вы ни старались этого избежать, в вашей кодовой базе будут лежать вложенные скобки.
Bracket Pair Colorizer позволяет очень четко видеть, когда ваше if условие или функция завершаются.
5. Живой сервер
Если вы новый разработчик и пишете свой код javascript, заходите в браузер и обновляете его, чтобы увидеть результаты, тогда сделайте себе одолжение и загрузите L ive Server.
Вы пишете код и нажимаете "Сохранить", вот и все. Live Server автоматически обновляет браузер с последними изменениями.
6. Стоимость импорта
Ваш веб-сайт становится медленным из-за того, что вы импортировали слишком много ненужных и больших файлов?
Загрузите Стоимость импорта, который расскажет вам о размере импортируемого файла, чтобы вы могли оптимизировать его на месте.
7. Лучшие комментарии
Комментарии - очень важная часть кода, хотя компилятор избегает этого, мы, как разработчики, не можем. Лучшие комментарии позволяют писать комментарии, удобные для разработчиков, с привязкой к ним цветовой схемы.
8. Выделите соответствующий тег.
Я знаю, что это не совсем для кода Javascript, но он очень полезен при написании HTML или JSX.
Highlight Matching Tag позволяет отслеживать совпадающие теги, облегчая вам кодирование и отладку.
Заключение
Я почти уверен, что пропустил некоторые из самых крутых расширений, и если вы думаете, что есть некоторые расширения, которые заслуживают места в этом списке, не стесняйтесь комментировать.
Надеюсь, вам понравилась эта статья и вы узнали что-то новое, и если вы действительно хлопнули в ладоши, подписывайтесь на меня, чтобы получить больше контента на Medium, а также в Twitter. Пожалуйста, не стесняйтесь комментировать и спрашивать что угодно. Спасибо за чтение 🙏 💖. Также не забудьте попробовать Bit.dev - это отличный инструмент. Это определенно облегчило мне жизнь 😃
Учить больше
Инкапсулирует компоненты с помощью Bit, чтобы запускать их в любом месте в ваших проектах и приложениях.
Бит инкапсулирует компоненты в ваших проектах со всеми их файлами и зависимостями, поэтому они могут работать где угодно в ваших приложениях.
Создавайте быстрее, делая ваши компоненты готовыми к повторному использованию, и сотрудничайте как одна команда, чтобы делиться и обнаруживать компоненты. Никакого рефакторинга или конфигурирования не требуется, просто делитесь компонентами и создавайте по-настоящему модульные приложения.
