Eddiebot: How to use soundex-code in Typescript

[RaisinTen]

I was trying to solve #245 and I'm a little confused about how to use soundex-code in Typescript.

I had previously tried soundex-code using just Node.js. This time, I was trying to set it up using Typescript.
Since @types/soundex-code doesn't exist, I tried making a custom type definition file:
types/soundex-code/index.d.ts:

declare module 'soundex-code' {
    function soundex(
        value: any,
        maxLength?: any | undefined
    ): any;
    export = soundex;
}

and this is how I'm using it in src/index.ts:

import soundex from 'soundex-code';
console.log(soundex('lol'));

When I'm tsc-ing, this is what I get in dist/index.js:

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const soundex_code_1 = require("soundex-code");
console.log(soundex_code_1.default('lol'));
//# sourceMappingURL=index.js.map

which doesn't work. To get it to work, this is the required change:

- console.log(soundex_code_1.default('lol'));
+ console.log(soundex_code_1('lol'));

Can someone please identify what I'm doing wrong here? :slightly_smiling_face:

[github-actions[bot]]

It's great having you contribute to this project

Feel free to raise an Issue! Welcome to the community :nerd_face:

If you would like to continue contributing to open source and would like to do it with an awesome inclusive community, you should join our Discord chat and our GitHub Organisation - we help and encourage each other to contribute to open source little and often 🤓 . Any questions let us know.

[alrifay]

try this import

import * as soundex from 'soundex-code';

[AllanRegush]

It works for me using @alrifay's suggestion.

[RaisinTen]

@alrifay thanks a lot! :slightly_smiling_face:
It did produce the intended output in dist/index.js but it also produces this error:

src/index.ts:1:26 - error TS2497: This module can only be referenced with ECMAScript imports/exports by turning on the 'esModuleInterop' flag and referencing its default export.

1 import * as soundex from 'soundex-code';
                           ~~~~~~~~~~~~~~


Found 1 error.

So, in tsconfig.json, I uncommented // "esModuleInterop": true and tried npm run start:local again but it again produced the same error. However, this time, the content of dist/index.js changed into this:

"use strict";
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
    result["default"] = mod;
    return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
const soundex = __importStar(require("soundex-code"));
console.log(soundex('lol'));
//# sourceMappingURL=index.js.map

I wonder where I went wrong.

[alrifay]

Thanks @AllanRegush for testing 🎉

@RaisinTen I tried this syntax mentioned here https://github.com/microsoft/TypeScript/issues/27293#issuecomment-549047461

import MyLibrary = require('my-library');

and it worked without any errors.
here is the typescript documentation for this weird syntax 😄

My working code:

index.d.ts:

export = soundex_code;
declare function soundex_code(value: string, maxLength?: number): string;

index.ts

import soundex = require('soundex-code');
console.log('soundex(Hello) =', soundex('Hello'));

[RaisinTen]

Finally, I fixed it! :smiley:
src/index.ts:

import soundex from 'soundex-code';
console.log(soundex('lol'));

src/@types/soundex-code/index.d.ts:

declare module 'soundex-code' {
    export default function soundex(
        value: string,
        maxLength?: number | undefined
    ): string;
}

and I set "esModuleInterop": true in tsconfig.json. Yay!

EDIT:
Here's another way without using default:
src/index.ts:

import soundex from 'soundex-code';
console.log(soundex('lol'));

src/@types/soundex-code/index.d.ts:

declare module 'soundex-code' {
    export = soundex;
    function soundex(
        value: string,
        maxLength?: number | undefined
    ): string;
}

+ set "esModuleInterop": true in tsconfig.json

[BOLT04]

It did produce the intended output in dist/index.js but it also produces this error:

@RaisinTen You can also add the following line to ignore the error instead of creating more code 😃

//@ts-ignore
import * as soundex from 'soundex-code'

[eddiejaoude]

Amazing collaboration everyone 😍

[RaisinTen]

@BOLT04 I think doing it without the type def code might lead to some type-related problems in the future because we are using Typescript to harness the power of static typing but we are turning off type-checking for a part. Also, @AllanRegush requested me to make a pr for a type def package for soundex-code in DefinitelyTyped. After it gets merged, we can use soundex-code like a completely normal Typescript package after installing @types/soundex-code. :slightly_smiling_face:

[BOLT04]

that's dope @RaisinTen 👍 👍