Почему в sublime text 3 не подсвечивает

Не распознает стили и проблема с подсветкой кода в Sublime Text

И чет не робит.. ваще никак.. хотя слово в слово.. знак-в знак..

смотрю.. у автора type=»text» выделяется другими цветами.. у меня другими..

type зеленый, = красный, «text» желтый.. как будто он их не так понимает.. это вообще законно?! =)

а еще бла-бла.. Sublime text(UNREGISTRE) в самом верху. Мож это как-то связано.

6 ответов

Все вопросы
Старые
Голоса

Просто подствечивает не так код или сам код не работает (стили не применяются к верстке)?

Если просто подсветка кода — не обращайте внимания, возможно что-то недоустановили (тема sublime text).

По поводу Sublime text(UNREGISTRE) — никак не влияет, можно пользоваться редактором.

Рабочий код можно здесь посмотреть, если что-то не получается (сам так делал) или в некоторых уроках есть вкладка Файлы(справа) от туда можно скачать исходный код к уроку.

Cам код не работает (стили не применяются к верстке). А остальное все работает.. хмм.. но все равно спасибо.. пойду искать ошибки мож где-т по коду..

И тут до меня дошлоооо.. у нас же в input в HTML они по-другому называются. странно.. как работало это в видеоуроке?! =)))))

в css пишите input[type=»text»], input[type=»password»], input[type=»search»]

Там type не search_field, а name search_field

т.е. правильно так (как и в уроке):

и соответственно в css обращение только к типам text, password, search

Ой-еееееей, точно! Я отвлеклась! А вы мне сэкономили время на поиске моей ошибки! +1 вам к очарованию =))))

Настраиваем Sublime Text 3

Sublime Text 3 — один из самых распространенных текстовых редакторов для программистов. Он предоставляет своим пользователям уникальные возможности, которых нет больше нигде. Одни из самых главных достоинств — кроссплатформенность и расширяемость.

Здесь можно настроить все — от внешнего вида до компонентов программы (плагинов). Но и уровень настройки у Sublime Text соответствующий — как редактор для программистов, он настраивается через исходный код, что под силу не каждому. В этой статье мы рассмотрим как выполняется настройка Sublime Text 3.

Что такое Sublime Text

Sublime Text

Для Sublime Text с первых же версий возможности были гораздо выше, чем у других редакторов. Шутка ли — полностью настраиваемый интерфейс, возможность настроить поведение программы, а не просто вводить текст? Что уж говорить о плагинах — код, написанный на Python, позволяет пользователю управлять редактором так, как укротитель змей, играя на магической дудочке, заставляет гигантского удава трепетать перед ним. Однако, как бы нам ни было жаль, именно это и отпугивает новичков — будучи не в состоянии настроить редактор, они перестают им пользоваться.

Настройка Sublime Text 3

Сначала поговорим про внешний вид, а затем перейдем к настройке горячих клавиш и плагинов.

1. Внешний вид Sublime Text

Итак, пора запустить Sublime Text (статья про установку — тут). Многим дизайн программы нравится, другим же — нет. И сейчас перед вами встает уникальная возможность поменять интерфейс до неузнаваемости!

Самый простой с виду способ — выбрать тему через настройки. Для этого идем в меню «Preferences» -> «Color Scheme» и выбираем нужную вам тему. Но это способ лишь поменяет расцветку редактора, и ничего более.

Выбор темы

Другой, более сложный, но верный вариант — разобраться с файлом настроек. Чтобы открыть его, перейдите в меню «Preferences» -> «Settings». И вот, перед вами не что иное, как громада текста. Но не все так сложно, как кажется! Слева — настройки по умолчанию, их трогать не надо. Их можно взять за пример. А вот справа нужно разместить свои настройки — взять, скопировать нужную строку и поменять ее значение. Основные настройки:

«color_scheme» — цветовая тема. Можно выбрать из существующих, а можно скачать в папку Packages/Color Scheme — Default/.
«font_face» — шрифт текста. Важно, чтобы он был в системе. Чтобы посмотреть список доступных шрифтов, откройте любой текстовый редактор, к примеру, Lible Office Writer.
«font_size» — размер шрифта, устанавливающийся дробным или целочисленным значением.
«font_options» — дополнительные опции шрифта типа «no_bold», «no_italic».
«word_separators» — разделители слов.
«line_numbers» — настройка нумерации строк.
«gutter» — отображать ли «канавку» (в ней располагаются номера строк и закладки).
«margin» — длина отступа от «канавки».
«fold_buttons» — если навести курсор на «канавку», то будут видны треугольные стрелки, позволяющие скрыть или показать фрагмент кода между фигурными скобками. Их тут можно отключить или включить.
«fade_fold_buttons» — если поставить значение false, то треугольные кнопки не будут скрываться.

Вот пример действия настроек (не забудьте сохранить файл):

После настройки

Вы можете поэкспериментировать здесь сами. А мы идем дальше.

2. Настройка сочетаний клавиш

Да-да, вы не ослышались! Любой может настроить сочетания по-своему, присвоив им другие значения. Чтобы открыть файл, перейдите в «Preferences» -> «Key Bindings».

Перед нами снова два файла, один из которых — настройки по умолчанию, а другой — ваши персональные настройки. Чтобы поменять сочетание, необходимо скопировать одну или несколько строк, заключенных между фигурными скобками. Вот пример моего файла:

Настройка клавиш

Конечно, это ничего не меняет (это сочетание клавиш для закрытия любого приложения), однако данный файл является лишь примером.

Ну вот и все, Sublime Text стал таким, каким он вам нужен и вы знаете как настроить Sublime Text 3. А сейчас пора двигаться дальше — к установке плагинов.

3. Установка Package Control

Как уже говорилось ранее, редактор имеет возможность добавления плагинов, будь то собственные или скачанные с сайта разработчика. Однако, несмотря ни на что, установка плагинов вручную не очень удобна, и поэтому нужно скачать и установить дополнительный компонент.

Package Control — предназначен для более быстрой и удобной установки плагинов. Он позволяет устанавливать их через визуализированный интерфейс, а не через код.

Для начала установим Package Control с официального сайта. Это не значит, что мы его будем скачивать!

Скопируем текст из соответствующего текстового поля (в зависимости от версии Sublime Text).
С помощью сочетания клавиш «Ctrl +

Package Control установлен! Теперь пора разобраться с тем, как им пользоваться.

4. Работа с плагинами в Package Control

Чтобы запустить Package Control, необходимо набрать сочетание клавиш «Ctrl + Shift + P» и из списка выбрать элемент Package Control: Install Package.

И перед нами долгожданная установка плагинов! Теперь есть возможность быстрого их поиска и выбора, а если выбрать другие команды для Package Control, то можно и удалять, и изменять элементы редактора. Теперь надо потренироваться на установке. Уставноим Material Theme и выполним настройки темы sublime text 3.

Запускаем установщик плагинов.

Набираем в поле поиска Material Theme.

Нажимаем и ждем, внизу должна появиться надпись «Installing package Material Theme». В процессе установки будет запрошено добавление еще одного плагина, разрешаем.

Чтобы применить тему, необходимо перейти в меню «Preferences» -> «Color Scheme» -> «Material Theme» -> «schemes», а далее — тема, которая вам больше всего понравится.

Однако это еще не все. Несмотря на установку темы в качестве плагина, она активируется не до конца. Чтобы исправить это, зайдите в файл настроек и допишите следующий текст:

«theme»: «Material-Theme.sublime-theme»,
«color_scheme»: «Packages/Material Theme/schemes/Material-Theme.tmTheme»,
«overlay_scroll_bars»: «enabled»,
«line_padding_top»: 3,
«line_padding_bottom»: 3,
// On retina Mac
«font_options»: [ «gray_antialias» ],
«always_show_minimap_viewport»: true,
«bold_folder_labels»: true,
// Highlight active indent
«indent_guide_options»: [ «draw_normal», «draw_active» ]

Вид редактора после применения к нему темы:

Неплохо, да? Настройка Sublime Text 3 почти завершена. А сейчас пора установить что-нибудь более существенное. Давайте ознакомимся с самыми популярными плагинами для Sublime Text.

Топ 5 плагинов для Sublime Text 3

1. Emmet

Emmet — плагин, позволяющий сделать отображение кода более удобным. Здесь используются сочетания клавиш. К примеру, «html + tab» создает каркас документа, а «div.wrapper + tab» превратится в полноценный код:

2. JavaScript & NodeJS Snippets

Этот плагин представляет собой коллекцию сокращений снипсетов для JavaScript. Длина набираемого текста с помощью подсказок правда уменьшается! К примеру, вместо набора «document.querySelector(‘selector’);» можно просто набрать «qs + Tab».

3. Advanced New File

Зачем искать место для нового файла в неудобном дереве каталога? Данный плагин позволит быстро и эффекстивно ввести нужные данные, и файл будет создан буквально за пару нажатий клавиш!

4. Git

Название этого плагина говорит само за себя: вы сможете выполнять все необходимые действия в рамках Git’а, не выходя из редактора!

5. GitGutter

Этот плагин позволит пользователю не только обращаться с обычными командами Git, но и работать с изменением версий: отлавливать их, просматривать, сравнивать — и все в режиме реального времени.

Выводы

Как писать код — дело каждого. Но есть удобные вещи, которые доступны всем, и нет смысла от них отказываться! Такие редакторы, как Sublime Text, особенно важны веб-разработчикам. А пока вы можете настроить редактор под себя сами — пусть это станет ВАШ собственный Sublime Text, в который вы вложили частичку собственной души. Удачи!

Изменить / добавить подсветку синтаксиса для языка в Sublime 2/3

Я хочу изменить / добавить подсветку синтаксиса для языка в Sublime 2/3.

Например, я хочу, чтобы ключевое слово было this окрашено в JavaScript.

Как я могу это сделать?

Я знаю, что есть файл предпочтений JavaScript C:\Program Files\Sublime Text 3\Packages , но я не знаю, что изменить, и нужно ли мне создать новый файл предпочтений JavaScript где-нибудь в этой папке %APPDATA%\Sublime Text 3 .

Подсветка синтаксиса контролируется используемой вами темой, доступной через Preferences -> Color Scheme . Темы выделяют различные ключевые слова, функции, переменные и т. Д. За счет использования областей, которые определяются серией регулярных выражений, содержащихся в .tmLanguage файле в каталоге / пакете языка. Например, JavaScript.tmLanguage файл назначает области source.js и variable.language.js к this ключевому слову. Поскольку Sublime Text 3 использует .sublime-package формат файла zip для хранения всех настроек по умолчанию, редактировать отдельные файлы не так просто.

К сожалению, не все темы содержат все области видимости, поэтому вам придется поэкспериментировать с разными, чтобы найти ту, которая хорошо выглядит и дает вам желаемое. В Sublime Text входит ряд тем, и многие другие доступны через Package Control , которые я настоятельно рекомендую установить, если вы еще этого не сделали. Убедитесь, что вы следуете указаниям ST3 .

Так получилось, что я разработал Neon Color Scheme пакет, доступный через Package Control, на который вы, возможно, захотите взглянуть. Моя главная цель, помимо попытки сделать широкий спектр языков как можно лучше, заключалась в том, чтобы определить как можно больше различных областей — гораздо больше, чем включено в стандартные темы. Хотя определение языка JavaScript не так тщательно, как, например, Python, Neon все же гораздо больше разнообразия, чем некоторые значения по умолчанию, такие как Monokai или Solarized .

Я должен отметить, что я использовал Better JavaScript определение языка @ int3h для этого изображения вместо того, которое поставляется с Sublime. Его можно установить через Package Control.

ОБНОВИТЬ

Недавно я обнаружил другое определение языка замены JavaScript — JavaScriptNext — ES6 Syntax . У него больше возможностей, чем у базового JavaScript или даже лучшего JavaScript. В том же коде это выглядит так:

Кроме того, поскольку я изначально написал этот ответ, @skuroda был выпущен PackageResourceViewer через Package Control. Это позволяет вам легко просматривать, редактировать и / или извлекать части или целые .sublime-package пакеты. Итак, если вы выберете, вы можете напрямую редактировать цветовые схемы, включенные в Sublime.

ЕЩЕ ОДИН ОБНОВЛЕНИЕ

С выпуском почти всех пакетов по умолчанию на Github изменения происходят быстро и яростно. Старый синтаксис JS был полностью переписан, чтобы включить в него лучшие части синтаксиса JavaScript Next ES6, и теперь он настолько полностью совместим с ES6, насколько это возможно. Тонн других изменений были сделаны крышки угловых и краевых случаев, улучшить консистенцию, и только в целом сделать его лучше. Новый синтаксис был включен в (на данный момент) последнюю сборку разработки 3111.

Если вы хотите использовать любой из новых синтаксисов с текущей бета-сборкой 3103, просто клонируйте репозиторий Github где-нибудь и свяжите JavaScript (или любой другой язык (и), который вы хотите) в свой Packages каталог — найдите его в своей системе, выбрав Preferences -> Browse Packages. . Затем просто git pull время от времени выполняйте a в исходном каталоге репо, чтобы обновлять любые изменения, и вы сможете наслаждаться последними и лучшими! Я должен отметить, что репо использует новый .sublime-syntax формат вместо старого .tmLanguage , поэтому они не будут работать со сборками ST3 до 3084 или с ST2 (в обоих случаях вам все равно следовало обновиться до последней бета-версии или сборки для разработчиков).

В настоящее время я настраиваю свою Neon Color Scheme для обработки всех новых областей в новом синтаксисе JS, но большинство из них уже должно быть охвачено.

Похожие публикации:

Плоский воздушный конденсатор имеет емкость с во сколько раз увеличится его емкость если расстояние

Погас свет в холодильнике что делать

Подтвердите действие на странице как убрать

Пользователь вводит 10 чисел напишите программу которая проверяет упорядочены ли они по возрастанию