Как запустить файл javascript в atom
Обновлено: 04.07.2024
Изначально считаем что у Вас установлена поддерживаемая операционная система, Node.JS и Atom. В примерах мы работаем в OpenSUSE (13.1) в нём (и вообще в дистрибутивах *nix) уже «из коробки» обычно есть не только Python но PHP и другие языки программирования. Так же исправно работает на Ubuntu (>12.04). Если у Вас Windows 7 или 8, а раньше Вы с ними (языками) не работали то их предварительно необходимо скачать и установить.
Примечание: перед началом работы желательно запускать Atom под root.
опыт показывает — работает стабильнее
Linter
Идеология Atom к подсветке в том, что основным пакетом для работы с синтаксисом и его анализа будет Linter, который является верхним уровнем в API для других линтеров кода. Это сделано для прекращения «войны между плагинами» (The idea is to stop the linter plugins war, by providing a top level API for linters to parse and display errors in the Atom editor). Тем не менее, не все сторонние разработчики придерживаются этой идеологии и пишут свои плагины.
- linter-php , для PHP `php -l`
- linter-phpcs , для PHP, `phpc`
- linter-phpmd , для PHP, `phpmd`
- linter-pylint , для Python, `pylint`
- linter-pyflakes , для python, `pyflakes`
- linter-pep8, для python, `pep8`
- linter-flake8, для python, `flake8`
- linter-javac , для Java, `javac`
- linter-jshint , для JavaScript and JSON, `jshint`
- linter-jscs , для JavaScript, `jscs`
- linter-scss-lint , для SASS/SCSS, `scss-lint`
- linter-coffeelint , для CoffeeScript, `coffeelint`
- linter-csslint , для CSS, `csslint`
- linter-rubocop , для Ruby and Ruby on Rails, `rubocop`
- linter-tslint , для Typescript, `tslint`
- linter-xmllint , для XML, `xmllint`
- linter-shellcheck , для Bash, `shellcheck`
- linter-scalac , для Scala, `scalac`
- linter-clang , для C / C++, `clang`
- linter-ruby , для ruby, `ruby -wc`
- linter-lua , для Lua, `luac -p`
Пакет Script: запуск программ из Atom
Script — пакет для запуска кода в atom.
Установка пакета Script, возможна из командной строки:
или меню
Packages->Settings View->Install->Packages
Каждый язык работает, при наличии предварительно установленного компилятора / интерпритатора.
Пакет Script обновляется довольно часто. Например поддержка Swift появилась менее двух недель назад. Так что скорее всего в ближайшее время появится поддержка новых языков.
Для запуска программы необходимо выбрать
Packages-->Script-->Run
Дополнительные опции можно найти в документации либо на страницах Atom`а или проекта.
Для функционирования должен быть создан рабочий каталог.
Путь к нему нужно прописать здесь:
Packages-->Script-->Configure Script-->Current Working Directory
Заявку разработчикам на поддержку нового языка можно оставить здесь (отвечают быстро)
И немного юмора от разработчиков пакета Script,
у которых, судя по всему, спрашивают всё на свете:
первод: Атом не может найти Нод | Руби | Питон | Мои носки
Python
Поддержка подсветки этого языка идёт изначально. Пакеты для работы с синтаксисом и отладки:
Linter + Language Python + Linter Python Pep8 + Script
Script запускает код на Python, а Linter и Linter Python Pep8 покажут синтаксические ошибки.
Возможно Вам, для работы с Python также поможет Atom Python Debugger.
Подсветка ошибок и запуск после установки будут выглядеть так:
Swift
Подcветка синтаксиса swift работает на любом дистрибутиве после установки пакета Language Swift:
Терминал
Для запуска исполняемого кода С, C++, Java иногда проще использовать сторонний пакет (не пакет Atom, а пакет вашего дистрибутива), который запускается через терминал, поскольку сам Atom поддерживает большое количество языков. Если Atom выступает в качестве редактора кода, a терминал рядом запускает его — это очень удобно для нас, поскольку терминал не имеет такое преимущество редактирования, как Atom.
Для запуска терминала в окне Atom установите пакет Term. Для запуска терминала в окне Atom выбрать
Packages-->Command Palette-->Toggle и Term
с нужными параметрами.
В заключении ещё один интересный кликабельный анимационный gif от разработчиков script, ссылки.
Я действительно скачал Atom и успешно запустил его. Но у меня нет никаких знаний, как начать работать в нем?
Вот что я вижу и пытаюсь набрать в окне:
Он не похож на код, и я не вижу "run" или каких-либо других кнопок для запуска этого кода.
Как закодировать и запустить проект javascript в Atom или любом другом IDE?
3 ответа
Я нахожу, что ATOM-хороший редактор, и он не зависит от платформы. Я запускаю atom в машине windows 7, и у меня есть проект, разработанный в JAVA, который я хочу протестировать, сделав некоторые изменения в коде. Однако я не нахожу, как запустить тест или построить проект. В принципе, я хочу.
Я пытался найти приличный ide для python3, и atom звучал хорошим выбором, но Atom runner не очень интерактивен. Например, этот простой код выдает ошибку, я вставляю скриншот, чтобы показать проблему такой, какая она есть: Могу ли я настроить atom для выполнения кода в интерактивном режиме? Я.
Теперь я добавлю несколько шагов, чтобы запустить программу JS.
- Открытый атом
- Откройте папку в Atom (Эта папка является папкой вашего проекта), нажав файл --> Открыть папку.
- В левой части экрана вверху вы увидите имя своей папки
- Щелкните по нему правой кнопкой мыши и выберите новый файл
- Назовите этот файл index.html
- Вставьте код в @user3538203 post в ваш файл index.html
- Снова щелкните правой кнопкой мыши на папке проекта и создайте новый файл с именем myScript.js
- Введите свой код Javascript здесь (т. е. console.log("test"); )
- Перейдите в папку проекта и откройте index.html в браузере
- Нажмите клавишу F12 и перейдите на вкладку Консоль
- Вы увидите результат console.log("test"), и атом будет действовать как IDE
Примечание: Есть способы заставить JS работать в консоли или в качестве приложения, но для этого потребуется больше знаний о JS, и вам нужно будет установить NodeJS или какой-то специальный пакет, как показал @user3538203.
Для этого у вас есть 2 варианта:
- Создайте страницу HTML и включите в нее Javascript
А затем откройте файл HTML, используя Safari/Chrome/Firefox
- Вы также можете запустить сценарий из Atom. Вам нужно будет установить пакет под названием "script". Вот шаги в Mac OSX, которые, вероятно, будут аналогичны в windows.
- В Mac из верхнего меню. Atom -> Настройки -> Установка.
- Поиск пакета "Script" вы обнаружите, что он имеет более 1 миллиона загрузок. После загрузки вы можете запустить свой скрипт, нажав cmd +i
Я не уверен, что вы можете сделать это в Atom по умолчанию. Я всегда просто использую командную строку для JS с Atom/Aptana и т. Д., Если я использую grunt, gulp, npm и т. Д.
Похожие вопросы:
Фон, который у меня есть с Javascript и другими веб-технологиями, - это просто создание веб-страниц. Поэтому я смущен тем, как Атом сделан с использованием Javascript ? Редактор использует какой-то.
У меня есть проект в Ninja-IDE, который мне нужно запустить от имени root. Как я могу сделать это с IDE? Я попытался запустить проект после запуска Ninja-IDE от имени root, но это не сработало. Я.
Я отключил привязку клавиш Atom IDE по умолчанию для комбинации alt + f (в моем keymap.cson): 'atom-text-editor': 'alt-f': 'unset!' Как сделать так, чтобы при нажатии кнопки alt + f отображался.
Я нахожу, что ATOM-хороший редактор, и он не зависит от платформы. Я запускаю atom в машине windows 7, и у меня есть проект, разработанный в JAVA, который я хочу протестировать, сделав некоторые.
Я пытался найти приличный ide для python3, и atom звучал хорошим выбором, но Atom runner не очень интерактивен. Например, этот простой код выдает ошибку, я вставляю скриншот, чтобы показать проблему.
Я новичок в программировании и atom, поэтому, когда я пытаюсь запустить свой код python, написанный в atom в terminal, я не знаю, how. i пытался установить пакеты типа.
Есть ли возможность установить SyncedSideBar или что-то подобное для Atom IDE ? Я использовал его в своем sublime text 3, и я искал тот же плагин, который будет работать для Atom. Мне нравится, как.
Я попытался запустить index.html внутри папки dist в браузере, но она не работает, в отличие от приложения angularjs, где мы импортируем файл скрипта в index.html, и приложение просто работает.
Всякий раз, когда я открываю atom IDE, в нем загружается окно chrome developer tools. Как я могу нормально запустить Atom для кодирования Проверьте скриншот
Преимущества Atom
Возможно, для кого-то это и не проблема… а мне не нравится.
Вот как выглядит atom в настроенном виде:
Внизу вы видите удобную вкладочку с терминалом и запущенный в ней тестовый nodejs сервер. Классно?
Но это еще не все «фичи», хехе. Atom не только позволяет запускать терминал, но так-же следит за синтаксисом и оформлением исходного скрипта. Стоит добавить лишний пробел или не верно оформить кавычки как он выдаст соответствующее предупреждение. «Говонкод» не пройдет! В качестве демонстрации я прямо сейчас, специально, допущу несколько ошибок в коде.
А вот вторая уже интереснее, хехе.
Это стилистическая ошибка, как выяснилось. То есть редактор сам следит за стилем написания кода. И если вы допускаете ошибки в этом самом стиле, он вас предупреждает.
Ну или, например, вот:
Однако, стоит заметить, что эти возможности «из коробки» не доступны. Вам придется настроить все самостоятельно. А я вам в этом помогу.
Настраиваем Atom и Nodejs
Для начала не плохо бы скачать и установить себе на пк оба этих приложения.
После установки запустите Atom. Нужно будет установить ряд пакетов, чтобы все работало как надо.
Собственно список пакетов:
Как установить пакет на Atom?
Покажу вам на примере установку одного пакета.
Идем в меню File -> Settings
Перед нами появится список настроек, где внизу будет пункт Install
Теперь остается просто ввести название пакета в соответствующее поле
после чего нажать <Enter> и получить список пакетов, доступных для установки
Остается выбрать Install и дождаться установки.
Управление пакетами осуществляется через специальный пункт меню <Packages>. Если вы использовали notepad++ то найдете в этом сходство редакторов.
Просто берем каждый пакет из списка выше и устанавливаем.
Терминал в Atom
После установки пакета platformio-ide-terminal у вас появится внизу на панельке небольшой значок «+», нажмите на него и откроется терминал в текущей папке проекта.
Блок открытой консоли можно свернуть, ткнув на значок стрелочки.
Чтобы развернуть ее назад, надо нажать на мини-иконку терминала.
Вот, собственно и все.
Создаем первое приложение nodejs используя Atom
В итоге редактор отобразит нашу папку в боковой панели.
Теперь надо в эту папку запихнуть проект на nodejs. Ну, в смысле, исходные файлы этого проекта. Нажмем на плюсик внизу и откроем терминал, после чего установим expressjs введя туда команду
npm install express-generator -g
После завершения команды берем и генерируем в текущем каталоге приложение nodejs express командой
После выполнения команды, в вашей папке появится ряд файлов.
Однако, это не конец работы с консолью. Необходимо установить зависимости для нашего приложения. Делается это командой:
После ее выполнения можно переходить к редактированию файлов.
Например, откроем файл представления, view->index.jade и напишем там что-нибудь…
А теперь, давайте запустим наше приложение, выполнив в консоли команду
Терминал запустит наш проект и перейдет в режим ожидания
Чтобы остановить работу сервера, надо в блоке консоли нажать Ctrl+C, это остановит сервер и вы сможете изменять файлы проекта.
Вот, собственно и все.
Преимущества Atom
Возможно, для кого-то это и не проблема… а мне не нравится.
Вот как выглядит atom в настроенном виде:
Внизу вы видите удобную вкладочку с терминалом и запущенный в ней тестовый nodejs сервер. Классно?
Но это еще не все «фичи», хехе. Atom не только позволяет запускать терминал, но так-же следит за синтаксисом и оформлением исходного скрипта. Стоит добавить лишний пробел или не верно оформить кавычки как он выдаст соответствующее предупреждение. «Говонкод» не пройдет! В качестве демонстрации я прямо сейчас, специально, допущу несколько ошибок в коде.
А вот вторая уже интереснее, хехе.
Это стилистическая ошибка, как выяснилось. То есть редактор сам следит за стилем написания кода. И если вы допускаете ошибки в этом самом стиле, он вас предупреждает.
Ну или, например, вот:
Однако, стоит заметить, что эти возможности «из коробки» не доступны. Вам придется настроить все самостоятельно. А я вам в этом помогу.
Настраиваем Atom и Nodejs
Для начала не плохо бы скачать и установить себе на пк оба этих приложения.
После установки запустите Atom. Нужно будет установить ряд пакетов, чтобы все работало как надо.
Собственно список пакетов:
Как установить пакет на Atom?
Покажу вам на примере установку одного пакета.
Идем в меню File -> Settings
Перед нами появится список настроек, где внизу будет пункт Install
Теперь остается просто ввести название пакета в соответствующее поле
после чего нажать <Enter> и получить список пакетов, доступных для установки
Остается выбрать Install и дождаться установки.
Управление пакетами осуществляется через специальный пункт меню <Packages>. Если вы использовали notepad++ то найдете в этом сходство редакторов.
Просто берем каждый пакет из списка выше и устанавливаем.
Терминал в Atom
После установки пакета platformio-ide-terminal у вас появится внизу на панельке небольшой значок «+», нажмите на него и откроется терминал в текущей папке проекта.
Блок открытой консоли можно свернуть, ткнув на значок стрелочки.
Чтобы развернуть ее назад, надо нажать на мини-иконку терминала.
Вот, собственно и все.
Создаем первое приложение nodejs используя Atom
В итоге редактор отобразит нашу папку в боковой панели.
Теперь надо в эту папку запихнуть проект на nodejs. Ну, в смысле, исходные файлы этого проекта. Нажмем на плюсик внизу и откроем терминал, после чего установим expressjs введя туда команду
npm install express-generator -g
После завершения команды берем и генерируем в текущем каталоге приложение nodejs express командой
После выполнения команды, в вашей папке появится ряд файлов.
Однако, это не конец работы с консолью. Необходимо установить зависимости для нашего приложения. Делается это командой:
После ее выполнения можно переходить к редактированию файлов.
Например, откроем файл представления, view->index.jade и напишем там что-нибудь…
А теперь, давайте запустим наше приложение, выполнив в консоли команду
Терминал запустит наш проект и перейдет в режим ожидания
Чтобы остановить работу сервера, надо в блоке консоли нажать Ctrl+C, это остановит сервер и вы сможете изменять файлы проекта.
Вот, собственно и все.
Комментарии (6):
Войдите или зарегистрируйтесь чтобы оставить комментарий
AtomJS — миниатюрный JavaScript фреймворк
Всем привет! Вторая часть про миниатюрный javascript фреймворк Atom (бывший Nano).
Более подробный api есть на ГитХабе
atom.extend, atom.implement
atom.extend позволяет расширять объекты и сам Атом.
atom.implement позволяет расширять прототипы элементов и Атома
Именно этим методы используются для написания плагинов.
На текущий момент есть плагин для работы с Dom а-ля JQuery, плагин для создания классов похожий на тот, что в MooTools и наборосок плагина Ajax
Плагин Dom мало изменился со времени предыдущего топика, потому описывать не буду, а Ajax-плагин будет описан ниже, в виде примера плагина
Atom.Plugins.Class
Плагин Class немного похож на тот, который идёт в MooTools
Но можно создавать не класс, а фабрику класса, которая может расширять его статичными свойствами и примесями:
Фабрику можно получить из класса, а класс из фабрики:
var AnimalFactory = atom.Factory(<>); var Animal = AnimalFactory.get(); Animal.factory == AnimalFactory;
В общем, обычное такие классы как в JavaScript
Создание плагина, расширяем прототипы
Итак, часто необходимо расширить прототип встроенных объектов. Давайте расширим прототип стандартного Array, добавив туда, если еще нету, forEach, map и toArray в статическое свойство:
Создание полноценного Атом-плагина
Теперь, если подключён Dom-плагин, можно расширить его методом, который будет получать данные с помощью ajax и загружать в текущий элемент.
Как видите, ничего сложного)
Я открыт для предложений, идей, коммитов) Сам развитие этого фреймворка не потяну, но если сообщество поддержит, то буду рад.
How to start javascript project in Atom? Or any other IDE?
I am new in Atom and javascript.
I did download Atom an successfully launch him. But I not have any knowledge how start to work in it?
That what I see and try type in window:
How to code and start javascript project in Atom or any other IDE?
Now I will add a few steps to start a JS program.
Note: There are ways to make JS work in the console or as an application but these will require more knowledge JS and you will need to install NodeJS or some special package as @user3538203 showed.
34222 silver badges1616 bronze badges
In order to do that you have 2 options:
- Create an HTML page and include the Javascript into it
And then open the HTML file using Safari/Chrome/Firefox
Atom - это отличный, многофункциональный текстовый редактор, с возможностью установки огромного количества расширений, позволяющих приспособить его практически к чему угодно. Сам редактор разработан компанией GitHub на основе их платформы Electron, которая включает Node.js и движок рендеринга Chrome. Благодаря этому она позволяет разрабатывать приложения для рабочего стола на основе веб-технологий.
В этой статье мы разберёмся, как пользоваться редактором Atom для веб-разработки, какие плагины нужно установить, а также как правильно всё настроить, чтобы получить удобное рабочее окружение.
Установка Atom
Для операционной системы Windows или MacOS редактор Atom можно загрузить с GitHub репозитория проекта. Затем надо распаковать полученный архив и запустить atom.exe. Программа портативная, поэтому установки не требует.
Версию для Linux можно скачать там же. Доступны deb- и rpm-пакеты, а также есть возможность собрать программу из исходников. Для установки загруженного deb-пакета в Ubuntu или Debian выполните команду:
sudo dpkg -i atom-amd64.deb
Также в Ubuntu можно установить программу через менеджер пакетов snap. Для этого выполните такую команду:
snap install atom
После завершения установки вы можете найти программу в главном меню системы:
Как пользоваться редактором Atom
1. Установка пакетов Atom
Основное преимущество Atom - возможность установки различных пакетов для поддержки огромного количества функций. Давайте сначала разберём, как устанавливать пакеты, а потом я буду просто говорить, что нужно установить для получения той или иной функциональности. Для установки нового пакета на вкладке Welcome Guide выберите Install a package, а затем Open Installer.
Это же окно можно открыть через главное меню. Для этого откройте Edit -> Preferences -> Install. Здесь есть поле поиска, в которое нужно ввести имя пакета для установки:
Далее для установки пакета нужно выбрать пакет из списка найденных и нажать кнопку Install.
Когда установка завершится, вы сможете открыть его настройки кнопкой Settings или деактивироивать его кнопкой Disable. Также вы можете устанавливать пакеты atom из командой строки. Для этого выполните в терминале:
apm install имя_пакета
2. Русификация Atom
Я не рекомендую русифицировать программу. Если вы разработчик, то английский вам обязательно понадобится и не нужно избегать возможности его практиковать. К тому же ничего сложного в меню нет, а в интернете есть множество инструкций на русском. Но если очень хотите, то можно. Для этого установите пакет atom-i18n. Это не просто русификатор Atom, пакет содержит поддержку огромного количества языков.
Когда пакет будет установлен, нажмите кнопку Settings под именем пакета и в поле Language выберите Русский:
Затем вам останется перезагрузить редактор. Теперь главное меню и контекстное меню будут на русском:
Как видите, получить русский язык в Atom не так сложно. Дальше в этой инструкции я буду предполагать, что русификацию вы не ставили и все названия кнопок будут на английском языке. Уже сейчас редактор кода Atom готов к использованию, но мы можем сделать его ещё лучше.
3. Выбор темы оформления
Тема оформления - это один из самых важных моментов в настройке Atom, так как внешний вид интерфейса и подсветка кода будут всегда перед вашими глазами. Для настройки темы откройте Edit -> Preferences -> Themes:
Здесь можно выбрать тему интерфейса Theme UI и тему подсветки синтаксиса Theme Syntax:
Доступна светлая тема и тёмная:
Тем синтаксиса тоже доступно несколько, выберите то, что вам нравится. Также можно устанавливать темы из сети.
4. Подсветка синтаксиса и ошибок
По умолчанию редактор подсвечивает синтаксис для большинства языков, потому что пакеты их поддержки установлены по умолчанию. Это PHP, HTML, Json, SQL, XML, CSS, CoffeeScript, JavaScript, Java, C/C++, Go и многие другие. Но если вы хотите подсветку для дополнительных языков, их надо установить. Добавьте поддержку twig, если пользуетесь этим шаблонизатором, установив пакет:
Также для улучшения вида файлов можно установить пакет, который добавляет для каждого типа файла иконки:
В Atom для подсветки ошибок на лету используется интерфейс линтеров. Есть общий пакет Linter, а также реализации проверки для разных языков. Чтобы добавить подсветку ошибок в PHP, CSS, JSON и HTML, надо установить эти пакеты:
- linter
- linter-ui-default
- linter-php
- linter-csslint
- linter-json-lint
- linter-htmllint
5. Поддержка Git
Системы контроля версий используются сейчас практически везде. Чтобы добавить поддержку Git в Atom, нужно установить пакет git-plus. После этого в среде появится интеграция с Git. Если в папке проекта есть Git-репозиторий, то вы будете видеть файлы, которые были изменены, новые файлы, а также текущую ветку. Кроме того, прямо из интерфейса программы можно выполнять коммиты:
Чтобы сделать коммит, нажмите на кнопку Git в нижнем правом углу экрана. Здесь надо выбрать изменённые файлы, затем ввести описание коммита и нажать Commit to имя_ветки. Рядом с кнопкой Git, есть кнопки, с помощью которых можно переключаться между ветками или публиковать изменения в удалённый репозиторий.
6. Автоматическое форматирование
Также для php нужно установить инструмент php-cs-fixer в систему. Для этого выполните такие команды в терминале Linux:
sudo chmod a+x php-cs-fixer
sudo mv php-cs-fixer /usr/local/bin/php-cs-fixer
Теперь в терминале у вас должно получиться выполнить команду php-cs-fixer. Если система не сообщила, что команда не найдена, то всё прошло нормально. В Atom теперь можно открыть меню Packages -> Atom Beautify и выбрать пункт Beautify для автоматического форматирования.
7. Редактор в стиле Vim
Если вам нравится философия редактора Vim, как мне, то вы захотите, чтобы в других реакторах можно было использовать все возможности vim. В Atom это возможно, достаточно установить:
Теперь вы можете перемещаться по тексту, используя клавиши h j k l, выделять с помощью v, использовать y x и p для копирования и вставки, / для поиска, а также команды vim, например :w для сохранения документа.
8. Префиксы в CSS
Множество новых функций, которые включены в CSS в разных браузерах, поддерживаются только в виде экспериментальных возможностей, которые можно использовать только вместе с префиксом производителя. Например -webkit, -ms, -moz и другие. Вручную расставлять эти префиксы не очень удобно, поэтому можно воспользоваться плагином autoprefixer.
После его установки выделите нужный фрагмент кода, затем откройте меню Packages -> Command Palette -> Toggle:
Далее наберите Autoprefixer и нажмите Enter. После этого префиксы производителя в css atom будут автоматически установлены:
9. Отладка PHP в Atom
При написании серьёзных проектов не обойтись без отладки. Для отладки PHP можно использовать отладчик Xdebug. Сначала нужно установить Xdebug в систему. В Ubuntu для этого выполните:
sudo apt install php-xdebug
Затем добавьте такие строчки в конфигурацию отладчика:
zend_extension=xdebug.so
xdebug.remote_enable=1
xdebug.remote_host=127.0.0.1
xdebug.remote_connect_back=1
xdebug.remote_port=9000
xdebug.remote_handler=dbgp
xdebug.remote_mode=req
xdebug.remote_autostart=false
Здесь важен параметр xdebug.remote_autostart, его значение должно быть false. Если это значение будет true, то отладчик будет запускаться для всех выполняемых скриптов, а это нам не нужно. Порт оставляем по умолчанию 9000, хост 127.0.0.1. Затем перезапустите веб-сервер, чтобы применить настройки:
sudo systemctl restart apache2
Далее надо установить пакет php-debug, также установите его зависимости, которые предлагает установить среда:
После установки вы можете запускать отладку. Для этого просто кликните напротив строчки, на которой нужно установить точку останова, чтобы появилась синяя точка:
Также можно просто выбрать строчку и в меню Debug выбрать Toggle Breakpoint. Затем откройте меню и выберите Debug -> Toggle Debugging.
Дальше займёмся браузером. По умолчанию отладка будет отключена. Чтобы её включить, установите это расширение. Затем кликните по его значку и выберите Debug:
После этого можно перезагрузить страницу и в Atom автоматически запустится отладчик, где вы можете выполнять программу пошагово и смотреть значения переменных. Когда программа спросит соответствие удалённого пути к локальному файлу, укажите в обоих полях одинаковый путь, если проект находится на локальной машине:
Затем вам станет доступна отладка:
А инструкция, как пользоваться Atom для отладки, уже выходит за рамки данной статьи, но я думаю, что вы разберётесь.
10. Работа с проектами в Atom
Настройка редактора Atom завершена, теперь немного про использование. Я думаю, не нужно говорить, как открывать и сохранять файлы. Но о проектах нужно сказать. Выбрав в меню File пункт Open Project Folder, вы можете выбрать папку, в которой находятся ваши исходные коды. Далее все файлы и папки из неё будут отображаться в виде дерева на левой панели - это очень удобно:
Выводы
В этой статье мы рассмотрели, как пользоваться Atom для веб-разработки, а также основные полезные плагины, которые можно установить и использовать. Есть и другие интересные расширения, например Emmet, но я им не пользуюсь, поэтому ничего о нем сказать не могу. В целом, при достаточной настройке, Atom превращается практически в полноценную среду разработки. А какие плагины и возможности Atom используете вы? Напишите в комментариях!
Нет похожих записей
Статья распространяется под лицензией Creative Commons ShareAlike 4.0 при копировании материала ссылка на источник обязательна.
Читайте также: