Как запустить код в возвышенном тексте 3 javascript

Обновлено: 21.11.2024

Sublime Text 3 (ST3) – это легкий кроссплатформенный редактор кода, известный своей скоростью, простотой использования и сильной поддержкой сообщества. Это невероятный редактор прямо из коробки, но настоящая сила заключается в возможности расширить его функциональность с помощью управления пакетами и создания пользовательских настроек.

В этой статье мы рассмотрим, как настроить Sublime Text для полноценной разработки Python (от начала до конца), расширить базовые функции с помощью пользовательских тем и пакетов, а также использовать многие команды, функции и ключевые слова. ярлыки, которые делают ST3 таким мощным.

Примечание. В этом руководстве предполагается, что вы используете Mac и знакомы с терминалом. Если вы используете Windows или Linux, многие команды будут отличаться, но вы должны иметь возможность использовать Google, чтобы быстро найти ответы, учитывая информацию в этом руководстве.

Прежде чем мы начнем, давайте уточним, что именно я имею в виду под «полным стеком».

В современном мире HTML5 и разработки мобильных приложений JavaScript буквально везде. ГДЕ УГОДНО. Python в сочетании с такими фреймворками, как Django или Flask, недостаточно. Чтобы действительно разработать веб-сайт от начала до конца, вы должны быть знакомы с JavaScript (и различными средами JavaScript), REST API, адаптивным дизайном и, конечно же, HTML и CSS и т. д.

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

Бесплатный бонус: 5 настроек Sublime Text для повышения производительности Python, бесплатный курс, который покажет вам, как оптимизировать настройку разработки Python.

Возможности

Начнем с некоторых стандартных функций Sublime Text 3:

Раздельные макеты позволяют размещать файлы на различных разделенных экранах. Это полезно, когда вы занимаетесь разработкой через тестирование (код Python на одном экране, тестовые скрипты на другом) или работаете над внешним интерфейсом (HTML на одном экране, CSS и/или JavaScript на другом).

Режим Vintage предоставляет вам команды vi для использования в ST3.

Примечание. Вы также можете создавать собственные фрагменты: Инструменты > Новый фрагмент. Обратитесь за помощью к документации, а также ознакомьтесь с некоторыми из моих фрагментов здесь.

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

После загрузки ST3 вы можете настроить его.

Установите инструмент командной строки subl

Точно так же, как в TextMate есть команда mate, в Sublime Text есть инструмент командной строки под названием subl, который позволяет открывать один файл или целый каталог файлов и папок из терминала.

Чтобы включить эту команду, создайте символическую ссылку на двоичный файл subl:

Убедитесь, что ссылка работает, открыв Sublime:

Если это не сработало, возможно, вам нужно добавить /bin к вашему пути:

Повторите первый шаг.

Примечание. Если у вас по-прежнему возникают проблемы, ознакомьтесь с этой статьей. Вы также можете прочитать о создании символических ссылок в Windows и Linux.

Теперь вы можете открыть файл или каталог, используя следующие команды:

Если в пути есть пробелы, вы должны заключить весь путь в двойные кавычки:

Чтобы просмотреть все команды, откройте файл справки:

Установить управление пакетами

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

  1. Для установки скопируйте код Python для Sublime Text 3, который можно найти здесь. Щелкните Вид > Показать консоль, чтобы открыть консоль ST3. Вставьте код в консоль. Нажмите Ввод . Перезагрузите ST3.
  2. Теперь вы можете устанавливать пакеты, используя сочетание клавиш Cmd + Shift + P. Начните вводить install, пока не появится Package Control: Install Package. Нажмите Enter и найдите доступные пакеты.

Вот некоторые другие соответствующие команды:

  • Список пакетов показывает все установленные вами пакеты.
  • Удалить пакет — удаляет определенный пакет.
  • Обновление пакета — обновление определенного пакета.
  • Обновить/перезаписать все пакеты обновляет все установленные пакеты.

Ознакомьтесь с официальной документацией, чтобы просмотреть дополнительные команды.

Создать файл пользовательских настроек

Вы можете полностью настроить Sublime Text с помощью файлов настроек на основе JSON, поэтому ваши индивидуальные настройки легко перенести или синхронизировать с другой системой. Во-первых, нам нужно создать наши индивидуальные настройки. Лучше всего создать базовый файл для всех сред, а также файлы настроек для конкретного языка.

Чтобы настроить базовый файл, нажмите Sublime Text > «Настройки» > «Настройки» — «Пользователь». Добавьте в файл пустой объект JSON и добавьте свои настройки следующим образом:

  1. Чтобы настроить параметры для конкретного языка, нажмите Sublime Text > «Настройки» > «Настройки» — «Дополнительно» > «Специфический синтаксис» — «Пользователь». Затем сохраните файл в следующем формате: LANGUAGE.sublime-settings. Для настроек, специфичных для Python, сохраните файл как Python.sublime-settings.
  2. Очевидно, что вы можете настроить параметры по своему вкусу. Однако я настоятельно рекомендую начать с моих базовых и специфичных для Python настроек, а затем вносить изменения по своему усмотрению.
  3. Необязательно: вы можете использовать Dropbox для синхронизации всех ваших настроек. Просто загрузите файлы настроек в Dropbox и загрузите их оттуда, чтобы синхронизировать среды Sublime на всех своих компьютерах.
  4. Хороший справочник по настройкам можно найти в неофициальной документации Sublime Text.

Темы

ST3 также дает вам возможность изменить общую тему, чтобы она больше соответствовала вашему характеру. Создайте свой собственный дизайн. Или, если вы не склонны к творчеству, вы можете загрузить одну из различных пользовательских тем, разработанных сообществом Sublime, через Package Control. Посетите ColorSublime, чтобы предварительно просмотреть темы перед их установкой.

Всегда популярная тема Soda Dark и минималистичная Flatland — две из моих любимых тем.

После установки темы обязательно обновите базовые настройки через Sublime Text > Preferences > Settings — User:

Пакеты

Помимо упакованных тем, я использую следующие пакеты для ускорения рабочего процесса.

Улучшения боковой панели

SideBarEnhancements расширяет количество пунктов меню на боковой панели, ускоряя общий рабочий процесс. Такие параметры, как «Новый файл» и «Дублировать», необходимы и должны быть частью ST3 «из коробки». Одна только опция «Удалить» стоит того, чтобы ее скачать. Эта функция просто отправляет файлы в корзину, что может показаться тривиальным, но если вы удалите файл без нее, то восстановить его будет очень сложно, если только вы не используете систему контроля версий.

Скачать прямо сейчас!

Анаконда

Anaconda — это совершенный пакет Python. Он добавляет ряд функций, подобных IDE, в ST3, включая следующие:

  • Автозаполнение работает по умолчанию, но существует ряд параметров конфигурации.
  • Линтинг кода использует либо PyLint, либо PyFlakes с PEP 8. Я лично использую другой пакет линтинга, как я объясню в ближайшее время, поэтому я полностью отключаю линтинг в определяемом пользователем файле настроек Anaconda, Anaconda.sublime-settings, через меню файла: Sublime > Настройки > Настройки пакета > Anaconda > Настройки — Пользователь:
  • Проверка сложности кода McCabe запускает средство проверки сложности McCabe в определенном файле. Если вы не знаете, что такое сложность, обязательно перейдите по ссылке выше.
  • Goto Definitions находит и отображает определение любой переменной, функции или класса во всем проекте.
  • Найти использование быстро ищет, где переменная, функция или класс использовались в определенном файле.
  • Показать документацию показывает строку документации для функций или классов (если они определены, конечно).

Вы можете просмотреть все функции здесь или в файле README в настройках пакета ST3: Sublime Text > Preferences > Package Settings > Anaconda > README.

Примечание. SublimeCodeIntel — еще один популярный пакет, который во многом похож на Anaconda. Я предлагаю протестировать их обоих.

Джанейро

Djaneiro поддерживает шаблоны Django и выделение ключевых слов, а также предоставляет полезные фрагменты кода (завершения табуляции) для Sublime Text. Система сниппетов невероятно экономит время. Вы можете создавать обычные блоки Django всего несколькими нажатиями клавиш для шаблонов, моделей, форм и представлений. Ознакомьтесь с официальной документацией, чтобы увидеть список фрагментов кода.

Мои личные фавориты для создания шаблонов: var creates > и tag create .

требованияstxt

requirementstxt обеспечивает автодополнение и подсветку синтаксиса, а также удобную систему управления версиями для ваших файлов requirements.txt.

SublimeLinter

SublimeLinter — это платформа для линтеров ST3. Сам пакет не включает никаких реальных линтеров; они должны быть установлены отдельно через Package Control с использованием синтаксиса именования SublimeLinter-[linter_name]. Посмотреть официальные линтеры можно здесь. Существует также ряд сторонних линтеров, которые можно просмотреть в Package Control. Ознакомьтесь с инструкциями по установке здесь.

Примечание. Большинство этих линтеров имеют связанные с ними зависимости, поэтому перед установкой прочтите инструкции по установке.

Вы можете настроить каждый линтер в определяемом пользователем файле SublimeLinter.sublime-settings: Sublime Text > Preferences > Package Settings > SublimeLinter > Settings — User. Например, я игнорирую следующие ошибки и предупреждения PEP 8:

GitGutter

GitGutter показывает маленькие значки в области желоба ST3, которые указывают, была ли строка вставлена, изменена или удалена с момента последней фиксации.

Примечание. Если вам нужна поддержка ряда распределенных систем управления версиями (Git, SVN, Bazaar и Mercurial), попробуйте Modific.

FTP-синхронизация

FTPSync синхронизирует ваш проект с удаленными файлами. Просто откройте файл, чтобы загрузить его (если удаленный файл новее вашего локального файла) и загружайте его на удаленный сервер при каждом сохранении. Это отличный способ синхронизировать локальные и удаленные устройства. Убедитесь, что вы добавили хотя бы одно удаленное соединение, нажав Sublime Text > Preferences > Package Settings > FTPSync > Setup FTPSync.

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

Расширенный новый файл

AdvancedNewFile используется для создания новой папки или файла из ST3 только с привязкой клавиш.

Просто вызовите ввод AdvancedNewFile с помощью соответствующей привязки клавиш. Затем введите путь вместе с именем файла в поле ввода. После нажатия Enter файл будет создан. Кроме того, если указанные каталоги еще не существуют, они будут созданы. По умолчанию путь к создаваемому файлу будет отображаться в строке состояния при вводе информации о пути.

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

Я заменил обычную команду Cmd + N для создания нового файла на AdvancedNewFile, добавив следующий код в файл Key Bindings — User: Sublime Text > Preferences > Package Settings > AdvancedNewFile > Key Bindings — User:

Вы также можете настроить каталог по умолчанию для начала: Sublime Text > Preferences > Package Settings > AdvancedNewFile > Settings — User

Теперь, когда я создаю новый файл, строка /Users/michaelherman/Documents/repos автоматически вставляется первой, поскольку в 99 % случаев я храню все свои сценарии в этом каталоге.

Эммет

Emmet, ранее известный как Zen Coding, использует простые сокращения для создания фрагментов кода HTML или CSS.

Например, если вы введете челку, ! , и нажмите Tab в файле HTML, после чего будет сгенерирован тип документа HTML5 и несколько основных тегов:

Дополнительную информацию см. в официальной документации, а также в этой удобной памятке.

Предварительный просмотр уценки

Предварительный просмотр уценки используется для предварительного просмотра и создания файлов уценки.

Для использования откройте диспетчер пакетов и введите Markdown Preview, чтобы отобразить доступные команды:

  • Предварительный просмотр Markdown: Python Markdown: Предварительный просмотр в браузере
  • Предварительный просмотр Markdown: Python Markdown: экспорт HTML в Sublime Text
  • Предварительный просмотр Markdown: Python Markdown: копирование в буфер обмена
  • Предварительный просмотр Markdown: Markdown со вкусом GitHub: предварительный просмотр в браузере
  • Предварительный просмотр Markdown: Markdown со вкусом GitHub: экспорт HTML в Sublime Text
  • Предварительный просмотр Markdown: Markdown со вкусом GitHub: копирование в буфер обмена
  • Предварительный просмотр Markdown: открыть памятку по Markdown

После преобразования выходной файл будет обновляться при каждом последующем сохранении.

Сочетания клавиш

  • Перейти к чему угодно Cmd + P используется для быстрого поиска и открытия файлов. Просто введите часть пути и имени файла в проекте, и вы сможете легко открыть этот файл. Это отлично подходит для быстрого открытия файлов в больших проектах Django.
  • Перейти к номеру строки Ctrl + G позволяет перейти к строке с определенным номером в активном файле.
  • Перейти к символу Cmd + R перечисляет все функции и классы в файле, чтобы их было легче найти. Просто начните вводить нужный.
  • Перейти к началу строки Cmd + Left и Перейти к концу строки Cmd + Right помогают перемещаться по строкам.
  • Удалить текущую строку. Ctrl + Shift + K удаляет текущую строку.
  • Множественное редактирование — мой любимый ярлык:
    • Выберите слово и нажмите Cmd + D, чтобы выбрать следующее такое же слово. Затем снова нажмите Cmd + D, чтобы снова выбрать следующее слово, и так далее.
    • Нажмите Cmd + левая кнопка, чтобы создать курсор для редактирования везде, где вы щелкаете.

    Примечание. Другие быстрые клавиши можно найти в этой статье.

    Пользовательские команды

    С помощью Python легко писать собственные команды и привязки клавиш. В настоящее время я использую этот рабочий процесс:

    1. Скопируйте путь к текущему файлу в буфер обмена (ссылка).
    2. Закройте все вкладки, кроме активной (ссылка).

    Установите их, добавив файлы Python в каталог /Sublime Text 3/Packages/User через меню файлов (Sublime > Preferences > Browse Packages), а затем открыв каталог User. Чтобы завершить настройку, привяжите их из файла Key Bindings — User (Sublime Text > Preferences > Package Settings > AdvancedNewFile > Key Bindings — User).

    Дополнительные ресурсы

    Бесплатный бонус: 5 настроек Sublime Text для повышения производительности Python, бесплатный курс электронной почты, который покажет вам, как оптимизировать настройку разработки Python + Sublime для максимальной эффективности.

    Заключение

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

    Если у вас есть какие-либо вопросы или предложения, дайте мне знать в комментариях ниже. Наконец, проверьте папку dotfiles в этом репозитории, чтобы просмотреть все ресурсы, которые я создал. Здоровья!

    Раз в несколько дней получайте короткие и интересные трюки с Python. Никакого спама никогда. Отписаться в любое время. Куратор: команда Real Python.

    DigitalOcean объединяет усилия с CSS-Tricks! Специальное приветственное предложение: получите бесплатный кредит в размере 100 долларов США.

    Sublime Text — один из самых популярных редакторов для веб-разработки и разработки программного обеспечения в целом. Это очень плавно и быстро по сравнению с другими редакторами (написано на C++ помогает этой скорости). В Sublime также есть множество плагинов, которые вы можете найти через Package Control.

    Что такое подключаемый модуль расширения JavaScript?

    1. Умное автозаполнение
    2. Обнаружение ошибок и анализ
    3. Рефакторинг кода

    Несколько других функций можно найти на странице Wiki.

    Большинство функций реализовано с помощью Flow под капотом, который представляет собой статическую проверку типов для JavaScript, созданную Facebook (если вы знаете TypeScript, он очень похож). Основная цель этого плагина — превратить Sublime Text 3 в JavaScript IDE. Он находится в активной разработке, и со временем в него будут включены другие функции.

    Есть два способа установки. Самый простой — через Package Control, второй — установить его вручную, выполнив следующие простые шаги.

    • Sublime Text 3, сборка 3124 или новее
    • Node.js (6 или новее) и плагин npm Sublime Text (только для Linux и Mac OS X)

    Поскольку Flow работает только в 64-разрядных системах, этот подключаемый модуль поддерживает:

    • Mac OS X
    • Линукс (64-разрядная версия)
    • Windows (64-разрядная версия)

    В Sublime Text есть собственная функция автозаполнения, но ей не хватает мощности, что делает ее не такой полезной, как могла бы быть. С этим плагином вы получите автодополнение на основе текущего контекста, как и любая другая IDE. Например, вы получите дополнения из импортированных классов, определенных в других файлах, таких как свойства и методы.

    Кроме того, список дополнений также будет содержать информацию о типах переменных и сигнатурах функций, чтобы можно было быстро их просмотреть.

    Вот как это работает с плагином:

    …и без плагина:

    Обнаружение ошибок и линтинг

    В Sublime Text изначально нет системы обнаружения ошибок и/или проверки. Благодаря Flow это можно сделать с помощью собственных команд CLI.

    Прежде всего вам необходимо создать проект JavaScript (см. вики-страницу Создание проекта JavaScript). Для того, чтобы сервер Flow проверил ваши файлы, вам необходимо добавить в них специальный комментарий: // @flow .

    Вы также можете установить дополнительные параметры в файле .flowconfig (см. официальный веб-сайт, чтобы настроить конфигурацию Flow.Например, если вы хотите, чтобы сервер Flow проверял все файлы, а не только файлы с @flow , вам необходимо установить для параметра all значение true :

    Чтобы позволить серверу Flow проверять также отдельные файлы, которые не являются частью проекта, вы можете активировать параметр в меню «Инструменты» > «Улучшения JavaScript» > «Использовать средство проверки Flow в текущем представлении (не используется в проекте)» для каждого представления Sublime. В этом случае сервер Flow увидит только текущий вид.

    Вместо этого, как говорится на официальном сайте, параметры lint можно указать в разделе .flowconfig [lints] в виде списка пар правило=серьезность. Эти настройки применяются глобально ко всему проекту. Пример:

    Настройки Lint также можно указать непосредственно в файле с помощью комментариев flowlint. Например:

    В Sublime Text изначально нет системы рефакторинга кода. Это реализуется с помощью команд Flow CLI для получения необходимой информации. На данный момент этот плагин предлагает различные функции рефакторинга кода, в том числе:

    Некоторые из них также могут иметь предварительный просмотр. Кроме того, такие функции, как «Безопасное перемещение», будут работать только с проектами JavaScript (см. также вики-страницу «Создание проекта JavaScript»).

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

    Запросы функций и улучшения

    Для запросов функций создайте задачу или используйте Gitter.

    Если этот проект помогает вам сократить время разработки и вам он нравится, рассмотрите возможность поддержки его пожертвованием на Patreon, Open Collective или с помощью PayPal. Спасибо!

    Комментарии

    Честно говоря, раньше я жил в Sublime. Однако на данный момент, когда мне нужно прыгать через обручи, чтобы мой редактор был хоть немного полезным, просто возьмите WebStorm или IntelliJ. Я с радостью заплачу деньги, чтобы выкупить время переналадки с машины на машину.

    Мне нравятся функции, но я немного ненавижу полный пользовательский интерфейс IDE. Мне кажется, что это слишком. Я знаю, что я настраиваю его, хотя, может быть, когда-нибудь я попробую еще раз

    Дополнения JavaScript для великолепного текста. Это поможет вам быстрее писать сценарии с помощью подсказок и дополнений.

    Подробнее

    • Версия 2.6.99
    • Домашняя страница github.com
    • Проблемы с github.com
    • Изменено 4 года назад
    • Последнее посещение 1 час назад
    • Впервые увидели 7 лет назад

    Установки

    • Всего 578 тыс.
    • Выиграйте 397 тыс.
    • Mac 96K
    • Линукс 86K
    < th scope="col">11 марта< th scope="row">Mac
    28 марта 27 марта 26 марта< /th> 25 марта 24 марта 23 марта 22 марта 21 марта 20 марта 19 марта 18 марта 17 марта 16 марта 15 марта 14 марта 13 марта 12 марта 10 марта 9 марта марта 8 7 марта 6 марта 5 марта 4 марта 3 марта 2 марта 1 марта< /th> 28 февраля 27 февраля 26 февраля 25 февраля 24 февраля 23 февраля 22 февраля 21 февраля 20 февраля 19 февраля 18 февраля 17 февраля 16 февраля 15 февраля 14 февраля 13 февраля 12 февраля 11 февраля
    Windows 56 57 60 95 67 99 86 70 49 71 71 70 86 64 75 56 54 77 90 80 80 73 68 67 68 93 69 81 86 64 49 59 90 82 71 82 54 66 82 86 79 55 65 48 52 77
    7 7 5 15 6 <тд>10 16 13 4 7 9 11 9 5 20 14 12 9 12 13 8 9 6 13 8 11 11 11 10 3 7 13 6 10 11 11 8 8 9 10 13 3 7 13 9 14
    Linux 15 20 10 11 10 14 11 13 9 15 14 11 10 10 18 16 18 13 14 16 19 13 12 15 8 10 16 15 13 10 13 17 19 20 12 8 13 19 22 11 19 16 16 16 12 14

    Ознакомление

    ОС ТЕПЕРЬ ПОДДЕРЖИВАЕТСЯ этим новым подключаемым модулем

    Завершения JavaScript

    Дополнения JavaScript для возвышенного текста

    Подсказки и дополнения помогут вам быстрее писать сценарии.

    Дополнения jQuery и NativeScript отключены по умолчанию! Вы можете включить их в «Настройки» -> «Настройки пакета» -> «Дополнения JavaScript».

    Некоторые функции могут использовать npm!

    Он будет загружен автоматически вместе с nodejs!

    Использование

    Чтобы попробовать, просто напишите.

    description-Name_of_function/property/method показывает объяснение функции/свойства/метода и его синтаксиса.

    Информация об описании функции/свойства/метода взята с этих сайтов:

    ВКЛЮЧИТЬ или ОТКЛЮЧИТЬ завершения

    Вы можете ВКЛЮЧИТЬ или ОТКЛЮЧИТЬ завершения! Просто перейдите в «Настройки» -> «Настройки пакета» -> «Дополнения JavaScript»

    .

    Функция «Найти описание JavaScript»

    Поддерживается только Sublime Text 3

    Вы можете проверить описание функции/свойства/метода, выбрав слово (или, в случае, если оно займет первое слово рядом с мигающим курсором), которое вы хотите найти. «щелкните правой кнопкой мыши» и выберите «Найти описание JavaScript».

    Появится всплывающее окно со списком возможных описаний или, в некоторых случаях, с прямым описанием.

    Список карт клавиш: «Настройки» -> «Настройки пакета» -> «Дополнения JavaScript» -> «Привязки клавиш» — по умолчанию.

    Функция «Описание при наведении»

    Поддерживается только Sublime Text 3, сборка >= 3124

    Просто наведите курсор на имя функции, свойства или конструктора, и появится небольшое всплывающее окно со всеми совпадениями, найденными в включенном списке /sublime-completions.

    • F = функция
    • P = свойство
    • C = конструктор

    Функция «Оценить JavaScript»

    Поддерживается только Sublime Text 3

    Эта функция использует node.js, установленный локально этим подключаемым модулем.

    Вы можете изменить путь к файлам «node.js» и «npm» в разделе «Настройки» -> «Настройки пакета» -> «Дополнения JavaScript» -> «Настройки» — «По умолчанию»

    Вы можете оценить весь выделенный текст или текущую строку! Если выделить текстовую область и оценить ее, в поле редактора появятся 2 белые точки. Первая белая точка представляет собой начало области, а вторая белая точка представляет собой конец области. Вы можете в конечном итоге изменить регион и, не выбирая повторно тот же регион, вы можете оценить его снова! Если вы хотите скрыть эти две точки, в контекстном меню есть пункт «Оценить JavaScript».

    Когда вы оцениваете код, этот подключаемый модуль будет добавлять "использовать строго"; автоматически!

    Существует два основных режима оценки кода: - eval - печать

    Список карт клавиш: «Настройки» -> «Настройки пакета» -> «Дополнения JavaScript» -> «Привязки клавиш» — по умолчанию.

    "Можно использовать?" Особенность

    Поддерживается только Sublime Text 3, сборка >= 3124

    Эту функцию можно использовать в контексте HTML, CSS и JavaScript!

    Просто наведите курсор на слово, которое хотите проверить, «щелкните правой кнопкой мыши» -> «Можно использовать?» и появится панель ввода со всеми элементами, имя которых совпадает со словом.

    Вы можете использовать комбинацию клавиш: ctrl+alt+w (super+alt+w в Windows). Список сопоставлений клавиш: «Настройки» -> «Настройки пакета» -> «Дополнения JavaScript» -> «Привязки клавиш» — по умолчанию.

    Вы можете найти его в меню "Инструменты" -> "Дополнения JavaScript" -> Поиск в списке "Могу ли я использовать".

    Функция «JSDoc»

    Поддерживается только Sublime Text 3

    Требуется npm

    Его можно найти в меню "Инструменты" -> "Дополнения JavaScript".

    Есть 2 пункта главного меню: - Создать документацию - Добавить файл конфигурации jsdoc в папку текущего проекта

    Эти элементы можно использовать только при открытой папке проекта.

    "Создать документацию" использует командную строку jsdoc для создания документации.

    Для настройки используется файл conf.json по умолчанию.

    "Добавить файл конфигурации jsdoc в текущую папку проекта" добавит файл conf.json со значениями по умолчанию в текущую папку проекта.

    Параметры контекстного меню

    Окружить

    Вы ДОЛЖНЫ сначала выбрать текст, чтобы «включить» эти параметры.

    Вы можете окружить код: - оператором if - оператором if else (это работает, только если вы выбрали 2 региона, см. пример) - оператором while - оператором do while - оператором for - оператором try catch - оператором try catch finally

    Эта опция работает также для нескольких вариантов одновременно.

    Удалить окружение

    Эта опция работает также для нескольких вариантов одновременно.

    Создать класс из литерала объекта

    Этот параметр создает класс JavaScript из литерала объекта (конструктор со всеми сеттерами и геттерами для каждого поля).

    Вы можете установить значения по умолчанию или использовать строку "обязательно", чтобы указать, что поле не имеет значения по умолчанию.

    Для правильной работы вы ДОЛЖНЫ объявить переменную и присвоить ей объектный литерал, как в этом примере:

    Эта опция работает также для нескольких вариантов одновременно.

    Сортировка массива

    Просто поместите курсор в скобки, и появится меню со следующими параметрами: - Сортировка массива ASC (функция сравнения: функция (x,y)) - Сортировка массива DESC (функция сравнения: функция (x,y)) - Сортировка массив по алфавиту ASC - Сортировка массива по алфавиту DESC

    Эта опция работает также для нескольких вариантов одновременно.

    Примеры использования:

    Разделить строковые строки на переменные

    Просто поместите курсор между строкой из нескольких строк, и эта опция появится в контекстном меню.

    Он разделит строку, и каждая строка будет объединена с переменной с именем «str».

    Наконец-то вышла первая стабильная версия Sublime Text 4! Мы усердно работали над улучшением, не забывая о том, что делает Sublime Text замечательным. Есть несколько новых основных функций, которые, как мы надеемся, значительно улучшат ваш рабочий процесс, а также множество мелких улучшений по всем направлениям.

    Огромная благодарность всем бета-тестерам в разногласиях и всем участникам наших пакетов.

    Изменения лицензии

    Лицензионные ключи Sublime Text больше не привязаны к одной основной версии, теперь они действительны для всех обновлений в течение 3 лет с момента покупки. После этого у вас по-прежнему будет полный доступ ко всем версиям Sublime Text, выпущенным в течение трех лет, но для более новых сборок потребуется обновление лицензии. Это те же условия лицензии, которые мы используем для Sublime Merge, и они позволяют нам выпускать более частые и интересные обновления, как только они будут готовы, без необходимости объединять их в новую основную версию.

    Множественный выбор вкладок

    Вкладки с файлами были улучшены, чтобы упростить разделение представлений, благодаря поддержке всего интерфейса и встроенных команд.Боковая панель, панель вкладок, Goto Anything, Goto Definition, автозаполнение и многое другое были изменены, чтобы сделать навигацию по коду проще и интуитивно понятнее, чем когда-либо.

    Apple Silicon и Linux ARM64

    Sublime Text для Mac теперь включает встроенную поддержку процессоров Apple Silicon. Сборки Linux ARM64 также доступны для таких устройств, как Raspberry Pi.

    Обновленный интерфейс

    Темы «По умолчанию» и «Адаптивная» были обновлены благодаря новым стилям вкладок и затемнению неактивных панелей. Темы и цветовые схемы поддерживают автоматическое переключение темного режима. Адаптивная тема для Windows и Linux теперь имеет настраиваемые строки заголовка.

    Контекстно-зависимое автозаполнение

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

    Поддержка TypeScript, JSX и TSX

    Поддержка одного из самых популярных новых языков программирования теперь поставляется по умолчанию. Используйте все интеллектуальные синтаксические функции Sublime Text в рамках современной экосистемы JavaScript.

    Сверхмощные определения синтаксиса

    Существенно улучшен механизм подсветки синтаксиса благодаря новым функциям, таким как обработка недетерминированных грамматик, многострочные конструкции, отложенное встраивание и наследование синтаксиса. Использование памяти сократилось, а время загрузки сократилось как никогда раньше.

    ГП-рендеринг

    Sublime Text теперь может использовать ваш графический процессор в Linux, Mac и Windows при рендеринге интерфейса. Это приводит к плавному пользовательскому интерфейсу вплоть до разрешений 8K, при этом потребляя меньше энергии, чем раньше.

    Выполняется рендеринг одного кадра. См. нашу запись в блоге о рендеринге OpenGL.

    Обновлен API Python

    API Sublime Text был обновлен до Python 3.8, при этом сохранена обратная совместимость с пакетами, созданными для Sublime Text 3. API был значительно расширен, добавлены функции, которые позволяют плагинам, таким как LSP, работать лучше, чем когда-либо. Прочтите обновленную документацию здесь.

    Совместимость

    Sublime Text 4 полностью совместим с версией 3. Он автоматически подхватит ваш сеанс и конфигурацию. Однако, если вы предпочитаете, можно хранить вещи отдельно.

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

    Текстовые редакторы, также называемые редакторами кода, представляют собой приложения, используемые разработчиками для написания кода. Они выделят и отформатируют ваш код, чтобы его было легче читать и понимать. Если вы использовали Codecademy, вы уже использовали текстовый редактор! Это область, в которой вы пишете свой код:

    Текстовые редакторы предоставляют веб-разработчикам ряд преимуществ:

    • Подсветка синтаксиса для конкретного языка.
    • Автоматический отступ кода.
    • Цветовые схемы, соответствующие вашим предпочтениям и оптимизирующие читаемость кода.
    • Подключаемые модули для обнаружения ошибок в коде.
    • Дерево папок и файлов вашего проекта для удобной навигации по проекту.

    Выбор текстового редактора

    На выбор предлагается несколько текстовых редакторов. Atom и Sublime Text 3 — одни из самых популярных текстовых редакторов.

    Sublime Text уже много лет является предпочтительным текстовым редактором. Он стабилен и надежен.

    Atom был выпущен GitHub после Sublime Text. Это полностью настраиваемый текстовый редактор. Поскольку Atom написан на HTML, CSS и JavaScript, вы сможете настроить его самостоятельно после изучения этих языков.

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

    Я. Атом

    Atom – это бесплатный текстовый редактор, созданный Github. Atom имеет открытый исходный код, а это означает, что весь код доступен для чтения, изменения для собственного использования и даже внесения улучшений. Atom — это «текстовый редактор, который можно взломать», потому что он легко настраивается.

    Как установить Atom

    ОС Х

    Atom работает на компьютерах Mac под управлением OS X 10.8 или более поздней версии.

    Посетите домашнюю страницу Atom и нажмите Загрузить для Mac. Через несколько секунд Atom появится в папке Загрузки в виде ZIP-файла:

    Нажмите на файл atom-mac.zip, чтобы извлечь приложение, затем перетащите новый значок в папку Приложения.

    Дважды щелкните значок приложения, чтобы загрузить Atom и начать работу.

    Windows
    Atom поддерживает Windows 7 и 8.

    1. Посетите домашнюю страницу Atom и нажмите Загрузить установщик Windows. Через несколько секунд Atom появится в папке Загрузки в виде файла .zip-файл.
    2. Для начала следуйте инструкциям установщика Windows. Вы можете посетить страницу установки Atom для Windows для получения более подробных инструкций.

    Сохранить файл с помощью Atom

    При первом открытии Atom появится Руководство по началу работы. Пока мы не будем знакомиться с Atom и начнем писать код.

    1. Закройте Руководство по приветствию, нажав значок x.
    2. На верхней панели Atom выберите «Файл» > «Новый файл». Появится пустой файл без названия.
    3. На верхней панели Atom выберите «Файл» > «Сохранить» или «Сохранить как».
    4. Назовите файл index.html. Крайне важно использовать расширение файла .html, чтобы Atom знал, как обеспечить подсветку синтаксиса HTML.
    5. Создайте простой HTML-файл:

    Исследуйте атом

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

    1. В строке меню Atom выберите «Файл» > «Добавить папку проекта». Это запустит ваш файловый менеджер. Перейдите к папке, содержащей файлы с текстом или кодом, и нажмите Открыть.
    2. Папка откроется на боковой панели Atom, отображая ее содержимое. Выберите из списка файлов или выберите вложенную папку.

    Чтобы изменить тему Atom:

    1. В строке меню Atom выберите Atom > «Настройки».
    2. На панели "Настройки" выберите "Темы".
    3. В разделе «Выберите тему» ​​вы можете смешивать и сочетать темы пользовательского интерфейса и синтаксиса из доступных вариантов или исследовать более 1300 пользовательских тем Atom. Вы можете сделать свой редактор кода похожим на редактор кода Codecademy, выполнив поиск codecademy-syntax-theme в меню «Установка» слева.

    Установить пакет
    Пакеты — это специальные надстройки, которые дополнительно настраивают ваш опыт написания кода с помощью Atom. Например, вам может понадобиться пакет, который выделяет синтаксические ошибки при написании кода. Такие пакеты называются линтерами.

    Давайте установим linter-tidy для нашего HTML:

    В строке меню Atom выберите Atom > «Настройки» > «Установить». Откроется панель настроек.

    В поле поиска введите linter-tidy. Atom будет искать пакеты в своей базе данных.

    Как только Atom обнаружит linter-tidy, установите пакет, нажав Установить:

    linter-tidy теперь будет отслеживать ваш HTML по мере написания кода и предупреждать вас о синтаксических ошибках. Здесь вы можете найти более 4500 пакетов Atom.

    Чтобы отключить или удалить пакеты, откройте Atom > Настройки > Пакеты, найдите свой пакет и выберите Отключить или Удалить.

    II. Великолепный текст

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

    Atom и Sublime Text являются не зависимыми программами. Хотя вы можете попробовать и то, и другое, вам не нужны оба для написания кода.

    Установите Sublime Text 3

    OS X
    Sublime Text работает на компьютерах Mac под управлением OS X 10.7 или более поздней версии.

    1. Посетите страницу загрузки Sublime Text. Выберите OS X из списка вариантов загрузки. Подождите несколько секунд, пока приложение загрузится.
    2. Перетащите значок Sublime Text в папку «Приложения». В процессе загрузки эта опция должна отображаться автоматически. Если это не так, найдите приложение в папке «Загрузки».
    3. Дважды щелкните значок Sublime Text, чтобы начать работу с вашим первым файлом кода.
      1. Посетите страницу загрузки Sublime Text. Выберите Windows из списка вариантов загрузки. Подождите несколько секунд, пока приложение загрузится.
      2. Откройте приложение либо из раздела загрузок браузера, либо из папки "Загрузки" на компьютере.
      3. Вы можете получить предупреждение системы безопасности с вопросом, можно ли запускать это программное обеспечение. Да, все в порядке. Нажмите Выполнить.
      4. Следуйте инструкциям мастера установки Sublime Text, чтобы установить программное обеспечение.
      5. Найдите Sublime Text в файловой системе и откройте его.

      Сохранить файл с Sublime Text

      1. В верхней строке меню Sublime Text выберите «Файл» > «Новый файл». Появится пустой файл без названия.
      2. Затем выберите «Файл» > «Сохранить» или «Сохранить как».
      3. Мы создадим простой HTML-файл: [снимок экрана]
        • Очень важно, чтобы вы использовали расширение файла .html, чтобы Sublime Text знал, что нужно обеспечить подсветку синтаксиса HTML.
      4. Создайте простой HTML-файл:

      Изучите возможности Sublime Text

      Добавление папки проекта
      Как и Atom, Sublime Text предоставляет древовидное представление вашего проекта, чтобы вы могли удобно перемещаться по папкам и файлам. Вот как это использовать:

      1. В верхней строке меню выберите «Проект» > «Добавить папку в проект».Это запустит ваш файловый менеджер. Перейдите к папке проекта по вашему выбору и нажмите Открыть.
      2. Папка откроется на боковой панели Sublime Text, отображая содержимое папки. Выберите из списка файлов или выберите вложенную папку.

      Чтобы изменить цветовую схему Sublime Text:

      Установить пакет

      Прежде чем мы сможем начать установку пакетов в Sublime Text, необходимо установить Package Control.

      Чтобы установить контроль пакетов:

      1. В верхней строке меню Sublime Text выберите «Вид» > «Показать консоль». Консоль Sublime Text откроется в нижней части окна.
      2. Перейдите на страницу установки Package Control и скопируйте код Python для Sublime Text 3.
      3. Вставьте код в консоль Sublime Text и нажмите Enter. Это настроит Sublime Text, чтобы вы могли начать установку пакетов.
      4. Чтобы убедиться, что Package Control настроен, выберите Sublime Text > Preferences. Должны появиться два новых параметра: Управление пакетами и Настройки пакета.

      Выберите Инструменты > Палитра команд

      Когда откроется палитра команд, введите Package Control: Install Package и нажмите Enter .

      html-tidy зависит от SublimeLinter. В поле поиска найдите SublimeLinter. Когда он появится в результатах поиска, выберите его и нажмите Enter .

      Установка займет несколько минут.

      Вернитесь к палитре команд и снова введите: Package Control: Install Package
      Затем нажмите Enter .

      Найдите SublimeLinter-html-tidy. Когда он появится в результатах поиска, выберите его и нажмите Enter. Установка займет несколько минут.

      Читайте также: