I ran npm install typeahead and npm install @types/typeahead, however I am
having trouble with importing typeahead into my tsx module:
import * as React from "react";
import "typeahead";
interface IReactTypeaheadInputProps {
id: string,
name: string,
url: string,
searchField: string,
}
export class ReactTypeaheadInput extends React.Component<IReactTypeaheadInputProps, {}>{
componentDidMount(): void {
.
.
.
$("#" + this.props.id).typeahead<string>(typeaheadOptions, datasets);
}
render() {
return (
<input id={this.props.id} name={this.props.name}/>
);
}
}
I've tried:
- various styles of import statements
adding an alias to my webpack.config.js file, like this:
resolve: { alias: { typeahead: 'typeahead.js' } }
When I use import "typeahead", I get
Uncaught TypeError: $(...).typeahead is not a function
When I use import * as typeahead from "typeahead";, I get
Uncaught Error: Cannot find module "typeahead"
I am getting intellisense for the whole Twitter.Typeahead namespace (I'm using VS 2017). However I suspect that the npm typeahead package is not official because it is an older version and the name of the file is typeahead.js instead of index.js in the node_modules folder.
I've tried to include the newer version manually but I get the same results.