Главная » Настройка рабочего пространства и установка необходимого программного обеспечения для работы с JavaScript.

Настройка рабочего пространства и установка необходимого программного обеспечения для работы с JavaScript.


22.02.2021, 22:01
Установка Node.js на компьютер

Самый первый шаг при подготовке рабочего пространства для работы с JavaScript - это установка Node.js. Для установки нужно перейти на официальный сайт Node.js и скачать версию для своей операционной системы.
Выбираем версию с пометкой "Recommended For Most Users"

Устанавливаем как обычную программу, не затрагивая никаких настроек. После установки можно проверить версию установленного программного обеспечения, набрав в окне терминала команду node -v

Microsoft Windows [Version 10.0.15063]
© Корпорация Майкрософт (Microsoft Corporation), 2017. Все права защищены.

C:\Users\psstu>node -v
v14.15.5

Подобным образом, но уже с помощью команды npm -v можно узнать версию менеджера пакетов npm, который установится вместе с Node.js по умолчанию.

C:\Users\psstu>npm -v
6.14.11

C:\Users\psstu>

Установка Visual Studio Code

Для работы с кодом и написания программ понадобится специальная программа, редактор кода. Устанавливаем в качестве редактора кода Visual Studio Code, для этого переходим на официальный сайт программы и скачиваем версию для своей операционной системы.

Устанавливаем скачанную программу на свой компьютер. Теперь для неё нужно установить дополнительные расширения (плагины), которые облегчают работу с кодом.

Необходимый список расширений для установки:

1. All Autocomplete
2. Auto Close Tag
3. Auto Complete Tag
4. Auto Rename Tag
5. Beautify
6. Code Runner
7. Import Cost
8. JavaScript (ES6) code snippets
9. jshint
10. Live Server
11. Multiple clipboards for VSCode
12. Reactjs code snippets
13. Sass
14. Theme - Oceanic Next
15. vscode-icons
16. ESLint

Для того, чтобы заработал плагин jshint, нужно установить для него npm-пакет, в редакторе VSCode открыть вкладку "Терминал" и прописать следующую команду:

npm install -g jshint

Для этого плагина есть свой файл настроек, называется он .jshintrc . Готовый файл с минимальными настройками можно скачать по этой ссылке (файл-архив).

После скачивания разархивируйте его в папку своего проекта (либо в корневую папку со всеми проектами) и его настройки будут применены для этого проекта.

Подробнее об опциях и настройках для jshint можно почитать здесь.

Настройка Visual Studio Code и полезные сочетания клавиш для более продуктивной работы

Данные настройки делать в файле settings.json в VSCode, просто добавьте их в уже имеющийся в нём список настроек.

Добавляем панель Default User Settings в редактирование настроек:

"workbench.settings.useSplitJSON'': true,

Автоматизируем проставление пустой строки в конце файла, убираем все пустые строки в конце кроме этой и удаляем все пробельные символы на конце строк и на пустых строках.

''files.insertFinalNewline'': true,
''files.trimFinalNewlines'': true,
''files.trimTrailingWhitespace'': true,

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

''editor.wordWrap'': ''on'',

Убираем алерты с предупреждениями при удалении и перетаскивании файлов и директорий

''explorer.confirmDelete'': false,
''explorer.confirmDragAndDrop'': false,

Активируем ZOOM на вращение колёсика мыши

''editor.mouseWheelZoom'': true,

Включаем "хлебные крошки" для открытых файлов проекта

''breadcrumbs.enabled'': true,

Ctrl + Shift + P — вызов палитры команд

Ctrl + P — открытие командной строки без флагов

Ctrl + , — переход в окно настроек

Ctrl + B — переключение видимости панели управления

Ctrl + ` — переключение видимости терминала

F11 — полноэкранный режим

Ctrl + (Mouse wheel) — переключение масштаба (ZOOM)

Ctrl + K Ctrl + 0 — сворачивание всех раскрываемых блоков

Ctrl + K Ctrl + J — раскрытие всех раскрываемых блоков

Shift + Alt + Arrow — копирование строки

Ctrl + / — вставка строчного комментария

Shift + Alt + A — вставка блочного комментария

КОММЕНТАРИИ (0)

ТЕГИ МАТЕРИАЛА
Visual Studio Code, npm, node.js
РЕЙТИНГ МАТЕРИАЛА (0.0 / 0)