how to install api(youtube-api-search ) in spfx&React project created by yeoman-generator

Question

I created my project wth yeoman template generator;

yo @microsoft/sharepoint

command(react choosen as JS framework). than installed youtube search api

npm install youtube-api-search 

so far everything seems ok.

But when I try to use api in project I encounter with "Cannot find module 'youtube-api-search'." here error messages in command line when I run "gulp serve";

I only added import YTSearch from 'youtube-api-search'; line to default code and I see these exceptions in commandline

here the lines if you cant see the image;

[11:02:03] Error - typescript - src\webparts\helloWorld\components\HelloWorld.tsx(6,22): error TS2307: Cannot find module 'youtube-api-search'.
[11:02:03] Error - 'typescript' sub task errored after 122 ms
 "TypeScript error(s) occurred."

I also checked youtube-api-search package exist under node_modules directory. so this error message makes no sense at all.

why does this error occurs here and more important how can I able to use third party apis(its not specific for youtube-api-search I think) in yeoman generated project

Answer 1

You need to install also TypeScript definitions for youtube-api-search to make it work. TypeScript should understand where to find your module. Since no typings provided you see this error.

I didn't find typings for this particular module (may be the name is different, give it a try), so in order to fix it you need to use commonjs style for loading modules.
Change it to: var YTSearch: any = require('youtube-api-search')