Typescript: Cannot find module angular

Question

I am working on angular 2 project with angular-cli (1.0.0-beta.10) and want to use this library (https://github.com/Glench/fuzzyset.js). When I try to import it, Typescript is not accepting it as a module I don’t really know why. It gives me Cannot find module error.

As a workaround I tried to declare it as module in my system-config.ts file

declare module "fuzzyset" {}

I am importing it in one of my component like this

import * as FuzzySet from 'fuzzyset';

and added to System Config:

System.config({
  paths: {
    // paths serve as alias
    'npm:': 'vendor/'
  },

  map: {
    'fuzzyset': 'npm:fuzzyset.js/index.js',
  },
  packages: cliSystemConfigPackages
});

But now it gives Cannot invoke an expression whose type lacks a call signature.

To solve this error I changed the module declaration to this:

declare module "fuzzyset" {
    export function FuzzySet(options?:any): any;
}

This does work in a way that everything is compiled, but then I am getting error at runtime as follow: Browser console errors

Can anyone help me on this? Thanks in advance :)

Kushina · Accepted Answer · 2016-10-25 10:34:07Z

1

I am able to solve the issue. It had some module definition issues and Typescript was not identifying it as a module. Modifying the definition in the library did work but that wasn't the right way. The end solution that worked without modifying the library was to add its definition in typings.d.ts. In case you want to see the code:

declare module "fuzzyset" {
     function FuzzySet(options?: FuzzySet.FuzzySetOptions) : any;
     namespace FuzzySet {
         interface FuzzySetOptions {
             arr?: any;
             useLevenshtein?: any;
             gramSizeLower?: any;
             gramSizeUpper?: any;
         }
     }
     export = FuzzySet;
}

answered Oct 25, 2016 at 10:34

Kushina

211 silver badge5 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Mahesh · Accepted Answer · 2016-10-19 21:47:09Z

0

Just simply use:

in app.ts

import fuzzyset from 'fuzzyset' (app.ts)

in config.ts

map: {
    'fuzzyset': 'npm:fuzzyset.js/lib/fuzzyset.js',
}

class definition,

        export class App {

      a: any;  // fuzzyset
      printThis: array;
      name:string;
      constructor() {
        // start doing fuzzy stuff
        this.a = FuzzySet()  

        this.a.add("michael axiak");

        this.printThisVar = this.a.get("micael asiak");
        // end doing fuzzy stuff
        this.name = 'Angular2'
      }
    }

in @component:

<p>{{printThisVar}}</p>

Working Plnkr here

Refer this and this

answered Oct 19, 2016 at 21:47

Mahesh

1,11910 silver badges21 bronze badges

4 Comments

Kushina Over a year ago

Thanks for the reply. Are you using Angular 2? Because it doesn't work for me it keeps giving me Cannot find module

Mahesh Over a year ago

yes. Angular 2.1.0. check config.js. Uses angular/core npm, whose latest is 2.1.0 - refer this. Did you try removing that declare module and simply import FuzzySet from 'fuzzyset'. I am afraid, if you are making it complicated than needed to import a simple javascript exported module.

Mahesh Over a year ago

If you are not using Systemjs and its config file config.js, as I had provided above, it will definitely NOT work. The Systemjs is recommended in both Angular2 (since you have tags Angular2, you are using it, I know that and I didn't even try Angular1, just so we are clear). SImilarly typescript also recommends it in their documentation. Also from System config documentation - "System Config is Built to the format ES6-specified loader API from ES6 Specification Draft Rev 27, Section 15,". If you are building something on your own, it is only repetitive unproductive work, just my 2 cents.

Mahesh Over a year ago

I suggest you take a look at the code I provided before complaining. All you have done above is wrap the FuzzySet inside another module, to make your declaration to work. Because you didn't have a module, now you create one and drop FuzzySet into it. If you want to overdo things, well that I can't help, really.

Collectives™ on Stack Overflow

Typescript: Cannot find module angular

2 Answers 2

Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related