Я использую Visual Studio 2013 для создания веб-сайта, который использует React и JSX для пользовательского интерфейса. Все это прекрасно работает, но создает медленную среду разработки, поскольку файлы .jsx рассматриваются как обычный текст. Поэтому подсветка синтаксиса не выделяется, и вы не можете установить точки останова, чтобы помочь отлаживать.
Есть ли способ улучшить этот опыт или мне нужно переключиться на другой редактор для файлов jsx?
Два трюка, которые я могу порекомендовать:
1) Вы можете заставить Visual Studio отображать файл .jsx с форматированием javascript. В Visual Studio откройте Инструменты > Параметры > Текстовый редактоp > Расширения файлов. Установите расширение на "jsx" и выберите редактор javascript и нажмите "Добавить". Возможно, вам придется закрыть и снова открыть VS, чтобы увидеть изменения. Если вы сохраняете свой метод render() в нижней части вашего .jsx файла, он работает очень хорошо.
2) Точки останова: нет, вы не можете добавить их раньше времени, но есть обходной путь. Когда вы запускаете свое веб-приложение в Visual Studio, открывается новая папка в окне Solution Explorer с именем "Script Documents". Код из ваших преобразованных файлов .jsx объединяется в этот файл "Script block". Вы можете добавить контрольные точки здесь после запуска веб-приложения в Visual Studio после загрузки веб-страницы.
По общему признанию, эти точки останова теряются, как только вы останавливаете отладчик. В следующий раз, когда вы запустите свою программу, вы должны установить их снова. Но, по крайней мере, вы можете получить свою ногу в дверь.
Если вы хотите прорваться в код, который уже запущен до полной загрузки веб-страницы, добавьте команду alert("here"); в jsx непосредственно перед строкой, в которую вы хотите проникнуть. Запустите код, и когда появится всплывающее окно, не нажимайте OK. Переключитесь на отладчик VS, добавьте контрольную точку в файл блока script, а затем нажмите кнопку OK. Код должен немедленно остановиться на вашей точке останова.