Typescript: How to use local type declaration file for npm module

Question

in my TypeScript code I want to include a NPM JavaScript module for which there are no typings.

import createPersist = require('vuex-localstorage');

Because of that the compiler complains:

error TS7016: Could not find a declaration file for module 'vuex-localstorage'. '<path>\node_modules\vuex-localstorage\dist\index.js' implicitly has an 'any' type.

One possibility to solve this is setting "noImplicitAny" to false in my tsconfig.json. But this I do not want. I want to know what is not typechecked any more.

So I wrote a minimal type declaration for vuex-localstorage which I put in my project directory:

interface PersistOptions {
    namespace?: string;
    initialState?: any;
    provider?: any;
    serialize?: (data:any) => string;
    deserialize?: (str:string) => any;
    expires?: number;
    merge?: (args:any[]) => any;
    reducer?: (state:any, paths:string[]) => any;
    paths?: string[];
}

declare function createPersist(options: PersistOptions): any;

export = createPersist;

However I still have the same error. I tried several things to get the TypeScript compiler to recognize my type declaration file but nothing worked.

So how do I do it?

Answer 1

you need to help the compiler know that what you wrote is for that module.

Try this:

declare module 'vuex-localstorage' {
    interface PersistOptions {
        namespace?: string;
        initialState?: any;
        provider?: any;
        serialize?: (data: any) => string;
        deserialize?: (str: string) => any;
        expires?: number;
        merge?: (args: any[]) => any;
        reducer?: (state: any, paths: string[]) => any;
        paths?: string[];
    }

    function createPersist(options: PersistOptions): any;

    export = createPersist;
}

Don't forget to make sure that this declaration file gets included in tsconfig.json.