it-swarm.com.ru

Поддержка Typescript для Visual Studio 2017

Недавно я пытался изучить TypeScript, и в некоторых видео, которые я смотрел после установки расширения «Web Essentials», при работе с .ts file Visual Studio предоставляет панель предварительного просмотра, чтобы вы могли видеть JavaScript как Вы печатаете.

Эти видео, похоже, используют VS 2012.

Однако установка Web Essentials на VS 2017, похоже, не имеет такой возможности, кто-нибудь знает, как я могу заставить это работать в VS 2017? Есть ли такая же поддержка для TypeScript?

15
Ayo Adesina

Таким образом, TypeScript устанавливается по умолчанию вместе с VS2017 (обновление 2 предоставит вам последнюю версию 2.3 и позволит устанавливать его параллельно). Если у вас его нет, вы можете добавить его с помощью установщика Visual Studio - в установщике щелкните меню бургера и выберите «Изменить», затем нажмите «Отдельные компоненты» и в разделе «SDK, библиотеки и фреймворки» можно добавить TypeScript.

После установки вы можете добавить файл tsconfig.json, чтобы сообщить компилятору TypeScript, как себя вести, например, здесь:

{
    "compileOnSave": true,
    "compilerOptions":
    {
        "noImplicitAny": false,
        "noEmitOnError": true,
        "removeComments": false,
        "sourceMap": true,
        "target": "es5"
    },
    "exclude":
    [
        "node_modules"
    ]
}

Важным параметром является compileOnSave, который сообщает VS скомпилировать файл js при сохранении ts.

Теперь вы должны увидеть, что у вас есть вложенный файл Javascript в вашем файле TypeScript:

 Nested TypeScript

Теперь вам просто нужно открыть оба файла рядом, и когда вы сохраните ts, js автоматически обновится (это помогает установить флажок всегда обновлять, если VS предложит вам загрузить измененный файл на диск).

19
Matt

Я вижу, ваш вопрос относится к VS 2017, и я не могу найти никакой документации по VS 2017, чтобы подтвердить, была ли она добавлена ​​обратно. Тем не менее, я обнаружил, что это было удалено в VS 2015. Смотрите эту ссылку на Github

Панель предварительного просмотра TS была удалена из Web Essentials 2015 из-за постоянных конфликтов с компилятором TS при появлении новых версий. Команда TS знает об этом, и я надеюсь, что они добавят эту функцию в инструментарий TS в будущем. Вполне возможно, что эта функция будет включена в новые расширения веб-компилятора ( https://visualstudiogallery.msdn.Microsoft.com/3b329021-cd7a-4a01-86fc-714c2d05bb6c ), когда будут реализованы панели предварительного просмотра.

7
HappyTown

У меня есть работа вокруг, это немного работы, но помогает в странных случаях, когда я хочу проверить вывод.

Я использую vs2017. У меня установлены веб-основы и веб-компилятор, но он все еще не поддерживает ts с 15.4, и я не смог заставить tsconfig.json работать.

Кратко покажите скрытые файлы в вашем проекте и выберите соответствующий файл js, затем перетащите вкладку вправо, чтобы у вас был разделенный экран  enter image description here

Когда вы изменяете и сохраняете файл ts, вы можете получить всплывающее окно с надписью «Файл изменился» или что-то в этом роде, там можно установить флажок, который гласит «Автосохранение, если не обнаружено никаких изменений» (опять же Перефразируя, я попытался найти вариант, чтобы я мог сбросить его, чтобы получить снимок экрана, но я не могу его найти!), проверьте это и затем выберите «Да для всех», чтобы обновить файл js. При следующем изменении файла ts файл js обновится.

Я знаю, что это не очень хорошо, но я нашел это очень полезным, так как я мог получить аналог того, что вы видите, следуя курсу, и они продолжают показывать предварительный просмотр javascript.

1
Luke Duddridge

В Visual Studio 2017 вам необходимо установить рабочую нагрузку «Разработка Node.js» во время процесса установки или изменить существующую установку в диалоговом окне «Новый проект», щелкнув ссылку «Не удается найти то, что вы ищете? Откройте установщик Visual Studio». , 

Затем Файл> Создать> Проект ... будет включать шаблоны проектов Javascript и TypeScript в категорию Установлено. 

0
Tom