Importing Victor.js in TypeScript?

Question

I\'m trying to use the victor.js library in a TypeScript project (3.0.1) and I\'m having real heartache trying to import and use it. I\'ve installed it from npm along with it\'s

Answer 1

I feel your heartache, In that I spent a large amount of time debugging various errors on how to write typescript definition files for existing javascript modules and finally got to what I thought was the final hurdle when I got stuck on the same error:

This module can only be referenced with ECMAScript imports/exports by turning on the 'allowSyntheticDefaultImports' flag and referencing its default export

The javascript in question here:

module.exports = class AthenaExpress { ...more code.. }

tsconfig.json for the compiling/"Working version" ¹:

{
  "compilerOptions": {
    "outDir": "dist/",
    "sourceMap": true,
    "noImplicitAny": true,
    "module": "commonjs",
    "target": "es6",
    "jsx": "react"
  },
  "baseUrl": "./src",
  "include": [
    "**/*"
  ],
  "exclude": [
    "node_modules"
  ]
}

"Working version" of the d.ts file with some import differences ²:

declare module 'athena-express' {
    import * as aws from "aws-sdk";
    interface ConnectionConfigInterface {
        aws: typeof aws,
        s3: string,
        getStats: boolean
    }
    interface QueryResultsInterface {
        Items: any[],
        DataScannedInMB: number,
        QueryCostInUSD: number,
        EngineExecutionTimeInMillis: number,
        Count: number,
    }

    interface QueryInterface {
        sql: string,
        db: string,
    }

    type QueryResult = QueryResultsInterface

    interface AthenaExpressInterface {
        new: (config: ConnectionConfigInterface) => any,
        query: (query: QueryInterface) => QueryResult,
    }

    class AthenaExpress {
        new: (config: ConnectionConfigInterface) => any;
        constructor(config: ConnectionConfigInterface);
        query: (query: QueryInterface) => QueryResult;
    }
}

Version of the d.ts file that received the same error, even when esModuleInterop was enabled, I also fiddled around with module and target to no avail. With import statement differences ³:

import * as aws from "aws-sdk";
interface ConnectionConfigInterface {
    aws: typeof aws,
    s3: string,
    getStats: boolean
}
interface QueryResultsInterface {
    Items: any[],
    DataScannedInMB: number,
    QueryCostInUSD: number,
    EngineExecutionTimeInMillis: number,
    Count: number,
}

interface QueryInterface {
    sql: string,
    db: string,
}

type QueryResult = QueryResultsInterface

interface AthenaExpressInterface {
    new: (config: ConnectionConfigInterface) => any,
    query: (query: QueryInterface) => QueryResult,
}

declare class AthenaExpress {
    new: (config: ConnectionConfigInterface) => any;
    constructor(config: ConnectionConfigInterface);
    query: (query: QueryInterface) => QueryResult;
}

export = AthenaExpress

notes:

The definition file location and the file I was trying to get working with the definition:

 tree src/backend/js
    src/backend/js
        ├── athena-express.d.ts
        └── helloworld.ts

1. "Working Version" meaning tsc seemed to compile without complaint
2. In helloworld.ts import {AthenaExpress} from "athena-express";
3. In helloworld.ts import * as AthenaExpress from "./athena-express";