Debugging файлов TypeScript в браузере через эмулятор DevExtreme


DevExtreme configuration debugging typescript javascript

Недавно встала задача добавить поддержку debugging'а файлов *.ts в браузере. В нашем случае это Google Chrome. Постараюсь как можно подробнее описать этот процесс.

  1. Для начала нужно определить в какой директории находится DevExtreme сервер, который запускает приложение, когда мы нажимаем в VS кнопку Запустить в браузере Google Chrome. Ответ на этот вопрос был найден в одном из тикетов на сайте DevExpress. В случае Visual Studio 2012 это путь C:\Program Files (x86)\Microsoft Visual Studio 12.0\Common7\IDE\Extensions\DevExtreme\WebServer

  2. Добавляем в проект *.map файл. Это необходимо для связи файлов js и ts

  3. Заключительный этап - добавление "символической ссылки" на проект в директории веб сервера DevExtreme. Можно просто скопировать проект в директорию указаную выше. В этом случае мы лишим сервер возможности автоматически подхватывать изменения в проекте. Чтобы это учесть, выполним команду mklink. Для этого:

    • Запускаем cmd под администратором
    • Переходим в каталог DevExpress WebServer
    • Выполняем команду mklink /D <project_link_name> <project_path>. В моем случае это mklink /D Pos C:\Projects\Pos
    • Символическая ссылка project_link_name создана в директории project_path

Дополнительный ссылки: