Import: module not found by compiler, works with Visual Code, DefinitelyTyped

Question

I'm new to Typescript and I hope I'm missing something simple here. I've installed type definitions for a javascript library and get an error thrown by the compiler but can't seem to figure out what's going on. My editor is Visual Studio Code and I'm developing a react typescript project on a Mac. Here's the play by play.

I installed type definitions for 'keen-tracking' like so,

npm install @types/[email protected]

Next, I added a few lines to 'src/vendor.ts' that looks like the following,

import KeenTracking from 'keen-tracking';

const keenTrackingCredentials = {
    projectId: 'xxx',
    writeKey: 'yyy'
  };

export const keenClient = new KeenTracking(keenTrackingCredentials);

Lastly, I import the keenClient in a component like so,

import {keenClient} from '../model/vendor';

const MyComponent :React.SFC<MemberProps> = props => {
    return <div>
        <Cover {...props} actionLabel="Label" action={function():void{ keenClient.recordEvent('pledge', {member: props.member.email} ) }} /> 
    </div>

I run my project with npm start and when I save the file, the compiler throws the following error

Module not found: Can't resolve 'keen-tracking' in '~/projectDir/src/model'

Visual Studio Code recognizes the link to the keen-tracking type definitions which looks like the following. I recognize that the typescript version is 2.0 and when I type tsc --version at a command prompt I see that version 3.2.2 is running, though I'm not positive that's the same version that Visual Studio Code is using.

// Type definitions for keen-tracking 2.0
// Project: https://github.com/keen/keen-tracking.js#readme
// Definitions by: Rui Ferreira <https://github.com/rui-ferreira>
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
// TypeScript Version: 2.2

export default class KeenTracking {
    constructor(options: { projectId: string; writeKey: string; requestType?: string });

    recordEvent(
        collectionName: string,
        event: object
    ): Promise<{ created: boolean }>;

    recordEvents(events: {
        [collectionName: string]: object[];
    }): Promise<{
        [collectionName: string]: boolean[];
    }>;
}

I'd appreciate any pointers on where I can look next to get this resolved, my current thinking is that the definition is incorrect or maybe I need to debug the generated js files, though I haven't figured out how to do that just yet. Thank you!

Answer 1

You installed types but not the module so install the module using below command and restart the app

   npm install keen-tracking --save

And also the way you installed types may not work

Try this too without version

  npm install --save @types/keen-tracking