Инструменты для JavaScript и TypeScript
Можете положиться на ReSharper, если используете JavaScript или TypeScript для программирования части или всей логики вашего приложения. ReSharper позволяет работать с файлами .js, .ts, .d.ts и .json, JavaScript-кодом, встроенным в HTML-файлы, а также с синтаксисом JSX.
Анализ кода
Для быстрого поиска ошибок в коде на JavaScript и TypeScript механизм анализа кода ReSharper использует около сотни инспекций. Еще около 50 проверок предусмотрены специально для TypeScript. Почти все обнаруженные проблемы можно мгновенно устранить с помощью быстрых исправлений.
В приведенном примере ввод = вместо == может привести к ошибке, которую легко упустить. Но только не с ReSharper.
Анализируя код, ReSharper учитывает уровень языка. По умолчанию уровень выбирается в зависимости от настроек проекта, но при необходимости вы можете изменить эти настройки.
Навигация и поиск
Большинство возможностей навигации и поиска ReSharper доступны для кода на JavaScript и TypeScript. Как обычно, все возможности навигации от выбранного символа доступны в меню Navigate To (Alt+`).
Все привычные команды поиска, такие как Ctrl+T (Go to Everything/Type) и Ctrl+Shift+T (Go to File), тоже работают. Все поддерживаемые возможности навигации и поиска учитывают особенности синтаксиса JavaScript и TypeScript. Например, в диалоге File Structure отображаются типы данных параметров, если они указаны в документации XML.
Функция структурного поиска и замены также понимает синтаксис JavaScript/TypeScript.
Автодополнение
Автодополнение помогает писать код на JavaScript/TypeScript быстрее. Когда вы печатаете, ReSharper анализирует окружающий контекст и учитывает символы, которые вы недавно использовали, чтобы предложить самые подходящие варианты автодополнения. Например, ReSharper поможет найти встроенные методы и свойства JavaScript, а также символы из JavaScript-библиотек, на которые есть ссылки в текущем проекте.
Контекстные действия и другая помощь
ReSharper позволяет быстро преобразовывать фрагменты кода на JavaScript/TypeScript с помощью 50 контекстных действий для JavaScript и TypeScript. Еще около 20 действий предусмотрены специально для TypeScript.
При работе с кодом на JavaScript и TypeScript у вас в распоряжении есть весь арсенал других полезных возможностей ReSharper: подсветка синтаксиса, перестановка фрагментов кода, расширение/сужение области выделения и многое другое.
Поддержка JSDoc
ReSharper облегчает чтение комментариев JSDoc, подсвечивая их синтаксис. При вводе комментариев JSDoc ReSharper предлагает дополнение ввода. Например, можно ввести /** над функцией, и ReSharper сгенерирует заглушки документации для всех параметров и для возвращаемого значения. Типы, typedef и обратные вызовы JSDoc также подсвечиваются и доступны в автодополнении кода.
Кроме того, все комментарии JSDoc к символам доступны в местах использования этих символов во всплывающем окне Quick Documentation.
Помощь при написании регулярных выражений
Поддержка регулярных выражений в ReSharper включает в себя полноценный анализ регулярных выражений JavaScript/TypeScript. По умолчанию регулярные выражения распознаются в литералах регулярных выражений, конструкторах и методах RegExp, а также в методах объекта String: match(), search(), replace(), split(). Однако ReSharper можно заставить проанализировать любой строковый литерал как регулярное выражение.
Рефакторинги
В коде на JavaScript и TypeScript можно использовать несколько рефакторингов, которые работают так же, как и в C#: Inline Variable, Introduce Variable, Introduce Variable for Substring и Rename.
В TypeScript можно использовать ряд рефакторингов для типов: Copy Type, Introduce Field, Move Type to Another File or Namespace и Move to Folder.
Есть еще один рефакторинг, предназначенный специально для JavaScript/TypeScript — Move to Resource. Этот рефакторинг работает в проектах JavaScript/TypeScript, созданных из шаблонов Visual Studio (например, Apache Cordova), и позволяет перемещать строковые литералы в файлы ресурсов.
Все рефакторинги для JavaScript/TypeScript также доступны в синтаксисе JSX.
Действие Create from usage
ReSharper позволяет использовать несуществующие символы, а затем генерировать реализации на основе этих использований почти на всех поддерживаемых языках. JavaScript и TypeScript — не исключение: для любых неразрешенных символов ReSharper предлагает один или несколько способов их создания.
Генерация конструкторов
Нажатие сочетания клавиш Alt+Insert на объявлении типа TypeScript позволяет быстро создать конструктор для этого типа с помощью ReSharper. Мастер генерации конструктора создает конструктор, не заданный по умолчанию, в параметры которого передаются поля типа и базовых типов.
Реализация/переопределение членов
Для унаследованных типов предусмотрены две взаимосвязанные возможности генерации кода:
- Implement missing members реализует все члены интерфейса или абстрактные члены, отсутствующие в текущем классе;
- Override members делает то же самое, но дополнительно переопределяет виртуальные члены, если это возможно.
Шаблоны кода
ReSharper предоставляет десятки шаблонов Live Templates для часто используемых конструкции JavaScript и TypeScript. Кроме того, доступны постфиксные шаблоны для TypeScript и JavaScript, а также шаблоны файлов для классов, интерфейсов и модулей TypeScript. Как всегда, вы можете создавать и добавлять свои шаблоны.
Соответствие выбранному стилю кода
ReSharper помогает соблюдать неприложные законы программирования на JavaScript и TypeScript: правила форматирования и правила именования.
Вообще говоря, форматирование кода работает еще лучше, чем в C#: нажмите Alt+Enter на выделенном блоке кода и выберите , чтобы просмотреть и настроить все правила форматирования, влияющие на выделенный блок.
Существуют параметры стиля кода, специально предназначенные для JavaScript и TypeScript: можно настроить последовательное использование одинарных (') или двойных (") кавычек для работы со строковыми литералами, а также автоматически добавлять или убирать необязательную точку с запятой в конце операторов.
В TypeScript также можно настраивать способ указания типов в объявлениях (явное имя типа, var или any), включить или выключить явное использование модификатора public и настроить способ импорта модулей.
Все параметры стиля кода JavaScript и TypeScript можно применять в любой области действия одной командой: с помощью либо быстрых исправлений, либо инструмента очистки кода Code Cleanup.
Помощь при модульном тестировании
ReSharper помогает обнаруживать и выполнять юнит-тесты на базе QUnit и Jasmine непосредственно в Visual Studio. Можно выбрать, в каком браузере требуется исполнять тесты JavaScript/TypeScript, или выбрать тестирование без пользовательского интерфейса с помощью PhantomJS.
Аналогично юнит-тестам .NET, тесты JavaScript/TypeScript, присутствующие в решении, можно просматривать с помощью Unit Test Explorer, выполнять их из этого окна, из Solution Explorer или прямо из редактора; также можно использовать несколько сессий юнит-тестирования.
JSLint, ESLint и TSLint
ReSharper дополняет встроенные правила анализа кода тремя инструментами статического анализа: JSLint, ESLint и TSLint. Все эти линтеры помогают обеспечивать удобочитаемость кода на JavaScript и TypeScript и удобство его поддержки. Они также позволяют добавлять собственные правила, которые можно включать в анализ кода ReSharper.
Если на компьютере уже настроен интерпретатор Node.js, линтеры можно включить в параметрах ReSharper в разделе Tools | Web Linters.
Помощники для значений JSON и каталоги схем
Помощники для значений JSON позволяют использовать ReSharper для автодополнения кода или валидации собственных файлов JSON. Помощник можно добавить на странице параметров JSON Value Helpers; совпадения проверяются по маске имени файла и/или по совпадению схем. В параметрах JSON также можно добавить собственные каталоги схем JSON.
Обратите внимание:
Все сочетания клавиш, приведенные на этой странице, соответствуют набору сочетаний «Visual Studio», использующемуся в ReSharper по умолчанию. Подробнее о двух наборах сочетаний клавиш, доступных в ReSharper, вы можете узнать в его документации.