10 най-полезни Atom пакети за уеб разработчици

Опитвали ли сте Atom? Въпреки че е съвсем ново, много от тях са се влюбили в Atom, текстов редактор, създаден от GitHub, който предлага много предимства и преди всичко е свободен за употреба. Atom идва с няколко вградени пакета, като например интеграция с Git и дървовиден изглед. Въпреки това, за целите на развитието определено ще се нуждаете от други пакети.

В този пост сме избрали няколко пакета, които уеб разработчикът трябва да има. Някои от тях са чудесни, за да ви помогнат да организирате вашия разхвърлян код, а други да ви помогнат да получите по-добър достъп до файловете си, без да напускате Atom. Тук са вашите 10 задължителни Atom пакета.

Средство за избиране на цвят

Както подсказва името, този пакет ви позволява да избирате цветове и е толкова лесно, колкото щракнете с десния бутон и изберете 'Color Picker'. Като алтернатива това може да стане чрез натискане на CMD / CTRL + SHIFT + C. Color Picker работи, ако курсорът е върху текста на CSS / SASS / LESS файлове, които съдържат един от следните цветови формати: HEX, HEXa, RGB, RGBa, HSL, HSLa, HSV, HSVa, VEC3 и VEC4, или цветна променлива на SASS или LESS. Той също така има възможност да конвертира между форматите.

мравка

мравка изглежда е плъгин, който трябва да инсталирате, независимо от средата на текстовия редактор. Основните характеристики на Emmet, като разширяване на съкращенията и опаковане със съкращения, ви позволяват да работите бързо, когато пишете HTML, CSS, Sass / SCSS и LESS синтаксиси. Например в HTML въведете р> a.mylink след това натиснете клавиша TAB, за да получите пълен HTML етикет

. Cheat Sheet ще ви помогне да научите бързо синтаксиса на съкращението на Emmet.

Minimap

Ако сте свикнали с Sublime Text, може да сте запознати с мини-прегледа в десния прозорец. Тази функция е полезна за бързо превъртане на дължините на изходните кодове за височината на прозореца. с Minimap, получавате това за Atom. Можете дори да настроите позицията да бъде отляво или отдясно, да включвате / изключвате осветлението на кода и др. Minimap дори идва с някои плъгини, за да разшири функционалността си, като цветен маркер.

разкрасявам

разкрасявам ще превърне вашия разхвърлян код по-чист и по-четлив. Той има голяма подкрепа за езиците за програмиране, като HTML, CSS, JavaScript, PHP, Python, Ruby, Java, C, C ++, C #, Objective-C, CoffeeScript, машинопис и SQL. След като инсталирате този пакет, за да го стартирате, просто кликнете с десния бутон и изберете „Разкрасяване на съдържанието на редактора“, или чрез Пакети> Atom Beautify> Beautify.

Атом ЛИНТЕР

Атом ЛИНТЕР идва като "къща" на лингиращи плъгини за основните езици, предоставяйки най-високо ниво API за линтери. Има налични linters за JavaScript, CoffeeScript, CSS / SASS / SCSS / LESS / STYLUS, Ruby, Python. На един език може да има повече един плъгин, като JSHint, JSCS и JSXHint за JavaScript.

След като инсталирате този основен пакет, трябва инсталирайте специфичния linter за езика, върху който работите, например, ако сте на JavaScript и изберете JSHint за linter, можете да го инсталирате като стартирате $ apm инсталирате linter-jshint на Терминал.

Икони на файлове

Икони на файлове добавяте икони към име на файл въз основа на съответния тип файл. Той ще добави визуални подобрения, когато отворите файл в раздела или в дървовидния изглед. Иконите на файловете могат да се персонализират: можете да добавите своя собствена икона и да промените цвета чрез малките файлове в пакети / файлови икони / стилове директория. Иконата по подразбиране се предлага в 8 цвята и 3 варианта (лек, среден и тъмен).

Фрагменти на JavaScript

Фрагменти на JavaScript ви позволява бързо да напишете част от изходния код на JS. С определено съкращение не е нужно да пишете кодова дума за дума, например просто напишете сантилитра да направя console.log и GI за getElementById. Тази функционалност е подобна на Emmet, но работи с JavaScript код. Този Atom пакет осигурява много от синтаксиса на JavaScript като функцията, конзолата и цикъла.

CSS гребен

CSS гребен прави кода на стила ви последователно форматиран, изглеждащ чист и красив. Можете да използвате предварително създадени предпочитания за сортиране, базирани на Yandex, Zen или CSSComb, или дори можете да използвате собствените си предпочитания, за да правите правила за сортиране. След като инсталирате този пакет, задачата за сортиране може да се извърши чрез натискане на CTRL + ALT + C или достъп от контекстното меню чрез Пакети> CSS гребен> Гребен.

Git Plus

Git Plus ви позволява да работите с Git, без да напускате редактора на Atom. В редактор можете да направите Git Commit, Checkout, push / pull, diff и други git команди. Трябва да настроите своя user.name и user.email на вашия git конфигурационен файл, за да работят всички функции. За да получите достъп до всички git команди, отворете палитрата с CMD + SHIFT + H или изберете Пакет> Git Plus.

Отдалечено редактиране

Отдалечено редактиране ви помага да виждате и редактирате вашите отдалечени файлове, без да напускате редактора или с други ftp приложения. За да започнете, първо създайте нов хост, след което добавете чрез менюто Пакети> Отдалечено редактиране> Добавяне на нов хост и въведете данните си за вход. Сега можете да прегледате отдалечените си файлове, използвайте CTRL + ALT + B, за да прегледате регистрирания хост и да видите файловете.