Рубрики
Без рубрики

Тип проверки глобальных библиотек JavaScript в коде VS, когда вы просто хотите изучить и код.

Иногда, когда вы прототипируете и изучаете новую библиотеку, вы хотите быстрого способа получить проверку типов/Intellisense/Auto-Complete, чтобы помочь с учетом. Вот быстрый способ включить проверку типов без полного выбора в TypeScript. Теги с JavaScript, VSCODE, TypeScript, TensorFlowJS.

Я изучал немного искусственного интеллекта/машинного обучения в свободное время, и недавно начал изучать немного tensorflowjs. Самый быстрый и самый простой способ получить TensorFlowJS – старый старый тег сценария. Когда вы экспериментируете и прототипируете вас Действительно Не хочу тратить время на инструменты сборки.

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

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

Вы можете просто загрузить tensorflowjs, как это:


Это сделает библиотеку доступной на глобальном окно объект как тфу

например

window.tf // the Tensorflow library

Одним из недостатков этого является то, что когда вы работаете с TensorFlow, вы не получите никаких автоматических полных в своем IDE/редакторе, потому что для анализа кода VS (или другого) не существует импортных ссылок на VS, в отличие Импорт ES6 или общие JS требуют заявлений.

Давайте посмотрим, как мы не можем вносить изменения в код, но дадим вам некоторую проверку хорошей типа и реальный бонус для изучения библиотеки: встроенная документация, которая так фантастическая.

Хотя этот урок объясняет, как включить проверку типов и документацию по библиотеке в коде VS, он может работать для других IDE, причина против кода настолько хороша, что здесь является его встроенная поддержка TypeScript.

Проверка типа на глобальной библиотеке

Создайте каталог и откройте его в коде VS.

Если у вас его еще нет, вы можете скачать VS -код через Здесь Анкет

Создайте простой HTML -файл с именем index.html С двумя импортами сценария, один для библиотеки и один для вашего кода. На самом деле мы не будем загружать этот файл на сервер и загрузить его в браузере в этом уроке, но я вкладываю это для полноты.




  
  
  
    
    
  

Причина создания отдельного index.js Вместо встроенного JavaScript в <Скрипт> Насколько я мог найти, проверка типов, кажется, не работает в файлах HTML. Если есть способ заставить его работать легко, я бы хотел знать!

Если у вас еще нет, сначала инициализируйте проект NPM в вашем каталоге, вы можете сделать это без проекта NPM, используя глобальные библиотеки с -g Я не пробовал это, хотя.

Если у вас нет Nodejs и NPM, вы можете скачать его здесь: https://nodejs.org/en/ Анкет

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

npm i @tensorflow/tfjs

Далее мы собираемся создать Файл объявления типографии . В этом файле мы сообщаем TypeScript, что библиотека TensorFlowJS будет доступна на глобальном Окно Интерфейс с переменной с именем тфу

Создайте файл с именем index.d.ts

interface Global {
    tf: typeof import("@tensorflow/tfjs")
}

interface Window extends Global {
}

Теперь наконец -то создайте index.js и откройте это.

Внутри файла поместите следующее вверху:

/// 
const tf = window.tf;

Если вы хотите узнать больше о нотации с тройными складами, вы можете узнать больше в Типовая документация

Теперь вот и волшебство, когда набрать вы теперь получите автоматическое завершение, например, если вы вводите тфу Вы должны получить несколько предложений 🥳.

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

Добавление простой проверки типов

Вы также можете добавить строгую проверку типов с одним комментарием в файле.

В index.js добавьте следующее в верхнюю часть вашего файла.

// @ts-check

Теперь вы должны увидеть это, когда вы кодируете, вы получите предупреждение типа, как:

Поздравляю, вы теперь приняли TypeScript! Если вы хотите, вы могли бы даже определить свои собственные типы в index.d.ts Анкет

Если вы хотите узнать больше о способах принятия TypeScript небольшими способами, это действительно отличное видео, которое показывает различные «степени» внедрения TypeScript в проекте, без необходимости перейти «все в».

Изучение tensorflowjs

Если вы хотите узнать больше о машинном обучении/Tensorflow, меня вдохновили, наблюдая за контентом из Джейсон Ленгсторф от его Учиться с Джейсоном сериал, который я очень рекомендую (если это уже не было очевидно). Одна из действительно удивительных вещей в этой серии – это закрытая подпись, что делает этот контент более доступным для всех 🎉.

На момент написания написания есть 3 сеанса, касающиеся машинного обучения и tensorflowjs, вот один из них:

Я надеюсь, что это было хорошее чтение, если вам хочется читать больше моей работы, пожалуйста, следуйте за мной в Твиттере @griffadev , или принесите мне кофе Если вам это кажется, ☕.

Оригинал: “https://dev.to/griffadev/type-checking-global-javascript-libraries-in-vs-code-for-when-you-just-want-learn-and-code-gdh”